在vue.config.js中引入sass全局配置后报错
vue.config.js代码如下:
module.exportsは= { devServer:{ ポート: 3333 、 オープン:真 }、 CSS:{ loaderOptions:{ SASS:{ データ: `@import "@ /資産/ SCSS / _variable.scss" ; ' } } } }
次のように_variable.scssコードは次のとおりです。
$テーマカラー:#33aef0。
SCSSアセンブリコードは次のとおりです。
<スタイルLANG = "SCSS"> #app { 色:$テーマカラー。 高さ:100VH。 } </スタイル>
次のように与えられたページ:
./src/assets/scss/reset.scss(./node_modules/css-loader/dist/cjs.js??ref--8-oneOf-3-1!./node_modules/postcss-loader/src??ref --8-oneOfの-3-2 ./ node_modules / SASS-ローダ/ DIST / cjs.js ?? REF! - 8-oneOfの-3-3 ./ SRC /資産/ SCSS / reset.scss) モジュールのビルド(./node_modules/sass-loader/dist/から失敗cjs.js): ValidationErrorを:無効なオプションオブジェクト。サスローダーは、APIのスキーマと一致していないオプションのオブジェクトを使用して初期化されています。 -オプションは、未知のプロパティ「データ」を持っています。これらのプロパティは有効です: オブジェクト{インプリメンテーション、sassOptions?、?、prependData sourceMap?webpackImporter?} 検証(E:\要素で -ui \ VUE-管理システム\ node_modules \スキーマ-utilsの\ DIST \ validate.js:85:11 ) Object.loaderで(E:\要素 -ui \ VUE-システム管理\ node_modules \ SASSローダ\ DIST \ index.js:36:28)
解决办法:
将data改成
prependData
// 旧
data: `@import "~@/assets/scss/variables.scss";`
// 新 prependData: `@import "~@/assets/scss/variables.scss";`