1. 报错现象
2. 首先检测是否未安装sass-loader插件
如未安装先安装sass-loader插件/或者版本不合适
npm uninstall --save-dev sass-loader // 卸载现有的sass-loader
npm install --save-dev sass-loader@8.0.2 // 安装版本可根据自己需求选择安装
3. 修改vue.config.js
原配置
// css 相关配置
css: {
// 是否使用css分离插件
extract: true,
// 开启 css source maps
sourceMap: false,
// css预设器配置
loaderOptions: {
sass: {
data: '@import "./src/styles/main.scss";'
}
}
},
修改后配置
// css 相关配置
css: {
// 是否使用css分离插件
extract: true,
// 开启 css source maps
sourceMap: false,
// css预设器配置
loaderOptions: {
sass: {
prependData: '@import "./src/styles/main.scss";'
}
}
},