解决sass 安装报错，踩坑记（所有sass 安装报错总结篇）

前言：昨天自己安装了一个新的vue项目，拉取项目以后按装sass依赖就死活安装不上，然后就在网上一顿查，最终解决了。基本把设计到的问题全看了一遍，在这里做一下整理。

心酸历程：

一般sass安装报错总结
大纲：

1.node-sass、sass-loader版本匹配问题，最佳的 sass 环境配置是 什么？
2.Python未安装
3.node-sass 已经废弃，推荐使用 dart-sass

1.node-sass、sass-loader版本匹配问题，最佳的 sass 环境配置是什么？

参考资料：https://www.jianshu.com/p/33e4cec41bd6

原因：不同的 node.js 版本需要安装不同的 node-sass 版本。并且要匹配合适的 node-sass、sass-loader 版本。

解决办法：
（1）将nodejs 版本为改回 14.x，不要使用 16.x 等版本；

（2）卸载node-sass 和 sass-loader

npm uninstall node-sass sass-loader

（2）安装匹配版本：

npm install sass-loader@7.3.1 node-sass@4.14.1  --save-dev

基本这种设置就能不会报错了。

小结：安装sass 基本环境最佳匹配 “nodejs 14.x” “sass-loader@7.3.1” “node-sass@4.14.1”。

2.Python未安装

报错信息：

Error: Can't find Python executable "python", you can set the PYTHON env variable.

原因：在 npm 请求 node-sass 文件中，如果失败，会尝试本地编译安装 node-sass，这里需要有Python环境。

解决办法：执行 npm install -g windows-build-tools 安装 windows-build-tools。

3.node-sass 已经废弃，推荐使用 dart-sass

原因：node-sass 简直是噩梦，太难安装了，还各种nodejs版本问题，有的时候几天都装不好，为了更加简便所以替换为dart-sass，vue中也推荐使用dart-sass，只是要注意部分语法不同，如/deep/。

安装方式：
（1）卸载node-sass 和 sass-loader

npm uninstall node-sass sass-loader

（2）安装

npm install sass-loader@^10 sass -D

官方的说法，安装 10.x 版本的 sass-loader 后，所有依赖成功安装，项目可以正常运行。意思就是说10.x 更加稳定吧。

到此，dart-sass安装方式结束。

备注：使用dart-sass以后，/deep/修改为 ::v-deep

/* 修改前 */
.a {
  /deep/ {
    .b {
      color: red;
    }
  }
}
 
/* 修改后 */
.a {
  ::v-deep {
    .b {
      color: red;
    }
  }
}

---

好了，基本到此，sass 安装的所有安装错误都能解决了。