老项目中node-sass更新sass

为了解决老项目下载依赖时间过长需要翻墙的问题，node-sass的更新势在必行

第一步：卸载项目中的node-sass和sass-loader

npm uninstall node-sass sass-loader --save-dev

第二步：安装sass、less和sass-loader、less-loader

npm install sass sass-loader --save-dev
npm install less less-loader --save-dev

第三步：重新配置vue.config.js

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

如果使用了stylelint，需要修改配置规则

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

安装更新依赖

npm i
npm run serve

修复项目里老css用法错误

然后需要全局替换一下/deep/，全局搜索 /deep/ , 将项目里的 /deep/ 替换为 ::v-deep