vue-cli3使用官方方法配置sass全局变量报错

jiezi

5 年前

更新的 scss 版本在 vue cli3 的项目里面的配置需要修改参数设置，具体在 vue.config.js 文件

sass-loader 报错：
Module build failed (from ./node_modules/_sass-loader@8.0.0@sass-loader/dist/cjs.js):
ValidationError: Invalid options object. Sass Loader has been initialised using an options object that does not match the API schema.

options has an unknown property ‘data’. These properties are valid:
object {implementation?, sassOptions?, prependData?, sourceMap?, webpackImporter?}
at validate (D: 旧项目 webDemonode_modules_schema-utils@2.2.0@schema-utilsdistvalidate.js:49:11)
at Object.loader (D: 旧项目 webDemonode_modules_sass-loader@8.0.0@sass-loaderdistindex.js:36:28)

注：（D: 旧项目 webDemo）是我们自己的项目存放的路径

css: {
    loaderOptions: {
      sass: {data: `@import "~@/assets/scss/variables.scss";`, // 这儿的键名改了},
    }
  }

// 旧
data: `@import "~@/assets/scss/variables.scss";`
// 新
prependData: `@import "~@/assets/scss/variables.scss";`