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.亲测有效！！！！！！！