這篇文章主要介紹了vue中使用sass及解決sass-loader版本過高導致的編譯錯誤問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
使用sass及解決sass-loader版本過高導致編譯錯誤
安裝依賴包
安裝node-sass、sass-loader和style-loader：
|
1
|
npm i node-sass sass-loader style-loader -D |
使用
|
1
2
|
<style scoped lang="scss"></style> |
解決編譯錯誤
操作以上步驟后，運行，發現報錯。原因是sass-loader版本過高，node-sass和sass-loader不兼容。解決辦法：卸載當前版本的sass-loader，安裝指定版本：
|
1
2
|
npm uninstall sass-loader //卸載npm install sass-loader@7.3.0 //安裝指定版本 |
安裝sass（規避因版本過高報錯）
安裝的兩個命令
|
1
2
|
npm install sass-loader@7.3.1 --save-devnpm install --save-dev node-sass |
配置文件
打開build文件夾下的webpack.base.conf.js
找到module.exports里的module，在rules里添加下面的配置：
|
1
2
3
4
|
{ test: /\.sass$/, loaders: ['style', 'css', 'sass']} |
樣式標簽更改
|
1
|
<style lang="scss"> |
然后 npm run dev 重啟一下
以上為個人經驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
(責任編輯：admin)本文地址：http://www.bmm520.net/info/wangzhankaifaqianhouduan/2023/0215/23497.html