最近在维护老的一个项目中发现使用了node-sass,导致本地下载依赖和cicd构建失败。说起这个依赖，真是心累，于是想找一个平替方案。经过不断查询和实践。总结出以下方案。

前言

Sass 有三个版本 Dart Sass、libsass 和 Ruby Sass：

• Dart Sass：用 Dart 语言写的 sass 实现，于2016年11月1日发布 alpha 版本，版本1.23.0之后完全支持模块化机制。
• libSass 也就是俗称的 node-sass，用 c/c++ 实现的 sass 版本，使用广泛，其中 node-sass 是绑定了 libsass的 nodejs 库，可以极快的将 .scss 文件编译为 .css 文件，安装过程很慢，官方也不推荐再使用了。
• Ruby Sass 是最初的 Sass 实现，但是2019年3月26日被停止了，以后也不会再支持，使用者需要迁移到别的实现上

安装使用

1.如果之前安装了 node-sass，可以先卸载

npm uninstall node-sass

安装 dart-sass

npm install sass sass-loader -D

2.配置 vue.config.js 文件
// 一般默认文件里是没有这个css配置的, 添加进去就好。

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

如果版本过高导致报错，如提示 TypeError: this.getOptions is not a function，退回 10.+ 可以运行成功

npm uninstall sass-loader  
npm install sass-loader@^10.1.1 -D

如果项目之前用到 /deep/ 需要替换为 ::v-deep，全局搜索 /deep/ , 将项目里的 /deep/ 替换为 ::v-deep

element2.x目前只有2.15.7版本是dart-sass。所以之前低于2.15.7可直接升到这个版本；
如果目前版本是高于2.15.7不建议降低版本

npm uninstall element-ui 
npm install element-ui@2.15.7

如果目前版本是高于2.15.7不建议降低版本，可参考以下方案：
部分项目因为element过高或过低，但不能改动element版本的，可能还是会warm(不影响运行)
推荐版本

"sass": "1.26.2",
"sass-loader": "^7.3.1",

npm uninstall sass-loader sass
npm install sass-loader@7.3.1 sass@1.26.2
项目中使用了stylelint , 可能需要修改下校验规则，在stylelint.config.js 代码如下

module.exports = {
  rules: {
    'selector-pseudo-element-no-unknown': [ true,
      {
        ignorePseudoElements: ['v-deep'],
      }
    ],
  },

sass语法更新工具 sass-migrator

对于一些sass语法的warming,可通过sass-migrator升级
1.安装sass-migrator，

npm install sass-migrator -D

2.在package.json的scripts里添加命令，

"sass-migrator": "sass-migrator division node_modules/*.scss"

3.最后执行

npm run  sass-migrator