先創(chuàng)建一個vue項(xiàng)目?vue create project08
然后選擇2.0版本的vue腳手架? vue3.0存在一些兼容問題? 我用2.0用的比較多一點(diǎn)
然后執(zhí)行下面提示的 cd project08??
再執(zhí)行打開這個項(xiàng)目的? npm run serve
然后按照以下使用less或者sacc即可
使用 Less
下載依賴:npm install less less-loader
在mian.js?中添加:
importlessfrom"less";Vue.use(less);
使用:
<style lang="less"></style>
使用 Less 時運(yùn)行報錯
this.getOptions is not a function
原因:less-loader安裝的的版本過高
解決:重新安裝較低版本
npm uninstall less-loader
npm install less-loader@5.0.0
使用 sass
下載依賴
npm install node-sass sass-loader style-loader
<style?lang="scss"?scoped>
這里面寫要用到的css代碼
</style>
使用
使用 sass 時運(yùn)行報錯
報錯:this.getOptions is not a function
原因:sass-loader安裝的的版本過高
解決:重新安裝較低版本
先卸載當(dāng)前版本的sass
npm uninstall sass-loader
安裝低版本sass
npm i sass-loader@6.0 node-sass --save-dev
<style?lang="scss"?scoped>
這里面寫要用到的css代碼
</style>
記得這個地方是scss不是sass哈? ? ?scss是sass的升級版? 它是一種SCSS-like語言,彌補(bǔ)了sass和css之間的鴻溝;