Vue配置sass


安装dart-sass

npm i sass

配置vue.config.js

module.exports = {
  css: {
    loaderOptions: {
      sass: {
        implementation: require('sass'), // This line must in sass option
      },
    },
  }
//other code
};

报错Error: Cannot find module 'node-sass'(需要安装sass-loader)

npm install node-sass --save-dev

如果报错Error: TypeError: this.getOptions is not a function(可能需降低sass-loader版本)

npm uninstall --save sass-loader  # 卸载sass-loader
npm i -D sass-loader@10.x  # 安装10.x 版本,也可试试11.x 版本

已安装node-sass的话需要先卸载,从package.json中删除

npm i sass sass-loader -D

全局搜索 (/deep/ 和 >>>) 替换为::v-deep

注意:

  • 如果vue3.0之前vue2.0你使用了/deep/ 没有替换 将会报错

使用node-sass经常会有css问题,安装时也容易出现问题,官方推荐使用dart-sass