vue cli3 安装sass失败总结
总之一句话,必须版本锁定,不然安装一次折腾一次,我也是折腾两次了,打算记录下来以后直接使用
1.安装好脚手架后执行以下命令,最后一个不需要版本锁定
npm install sass-loader@7.3.1 --save-dev //安装sass-loader npm install node-sass@4.14.1 //安装node-loader npm install style-loader --save-dev //安装style-loader
2.如果已经安装了。需要卸载从新安装
npm uninstall sass-loader //卸载当前的sass-loader版本 npm uninstall node-sass //卸载当前的Node Sass版本
3.在脚手架vue.config.js进行配置,这里注意sass配置改变了
css: { // 是否分离css(插件ExtractTextPlugin) extract: true, // 是否开启 CSS source maps sourceMap: false, // css预设器配置项 loaderOptions: { sass: { prependData: `@import "@/assets/css/base.scss";` } }, // 是否启用 CSS modules for all css / pre-processor files. modules: false },
以前的sass配置:
sass: { data: ` @import "~@/assets/name.scss"; ` },
现在新的配置:
sass: { prependData: `@import "@/assets/css/base.scss";` }
4.亲测有效!!!!!!!