Syntax Error:

 

錯誤描述

啟動項目時報錯：File to import not found or unreadable: ./src/assets/css/variables.scss.

 

 

報錯原因

需要在配置文件中指定 variables.scss 的位置。

 

解決方案

 

調整 sass 版本

"node-sass": "^4.14.1",

"sass-loader": "^7.1.0",

 

npm uninstall node-sass --save-dev
npm install node-sass@4.14.1 --save-dev

npm uninstall sass-loader --save-dev
npm install sass-loader@7.1.0 --save-dev

 

 

調整 vue.config.js 配置

在 vue.config.js 配置文件中添加如下 scss 的配置：

scss: {
  prependData: ` @import "~@/variables.scss"; `
}

 

module.exports = {
  css: {
    loaderOptions: {
      sass: {
        data: ` @import "./src/assets/css/variables.scss";
                @import "./src/assets/css/mixin.scss";
                 `
      },
 scss: { prependData: ` @import "~@/variables.scss"; ` }
    }
  }
}