macbook m2 pro 安装老项目 node-sass

最近更新的电脑设备macbook m2 pro 打算用来办公和家用。我是在拼多多买的，已安全下车，比相同配置的其他官网省5000左右（当时官网已经不卖了，在卖m3），比其他平台省3000左右，保修正常，嗯，没错就是主打穷和舍不得。想入手的可以联系我，不推销任何平台和店铺。

言归正传，公司有老项目，用到了node-sass，用过的人都知道很坑：版本不匹配，源下载不下来等等。

简单介绍一下node-sass

Node-sass is a library that provides binding for Node.js to LibSass , the C++ version of the popular stylesheet preprocessor, Sass. It allows you to natively compile .scss files to css at incredible speed and automatically via a connect middleware.

从上面的介绍可以知道，node-sass 是一个 nodejs 环境下提供的一个 Bridge，它提供了调用 LibSass 的能力（而 LibSass 是一个 C++ 实现的样式预处理器）。

ps: 可以看到，node-sass 并不完全是 javascript 实现的，而是借助了 C++ 的能力，毕竟编译型语言还是速度快啊。

维护人较少的项目，或者不太久远的项目，尽快改掉node-sass吧

换包方案：

1. sass sass 是一个纯 js 的 npm 包（是从dart转译来的，类似ts转译成js）。

sass 不像 node-sass 一样需要 node-gyp，在安装的时候也不需要进行编译，所以也没有了 node-sass 安装时常见的一堆问题。

2.less

3.Dart Sass是 Sass 官网力推的工具，它包括了基于 Dart VM 的命令行工具，以及基于 Node 的纯 Javascript 实现。前者说的 Dart VM 就是现在很火的 Flutter 选择的编程语言 Dart 的虚拟机；而后者的出现是为了能快速与 Node 环境下现有的工作流集成，比如 webpack，gulp等。Dart Sass的命令行工具是比 Javascript Library性能更好的，但是为了快速对接 webpack 等工具，我们目前一般通过npm install --save-dev sass直接使用 sass 的 Javascript Library。

如果不能换包或者选择直面问题：

具体背景：公司老项目，node：v14.18.1，node-sass：v4.4.1

解决路程：

1. 下载nvm, 安装14.18.1版本的node
2. 先从window电脑运行的这个老项目拷贝出node-sass，甚至整个node_model依赖包

报错找不到 ### Cannot find module 'true-case-path'应该是版本不一致问题，需要本机自行下载才可以匹配到（有些window电脑拷贝相同系统就可以解决问题，取决于本机环境）

4. 再从mac电脑运行的老项目拷贝出node-sass

报了另外一种包版本之间的依赖错误，确实需要本机自行下载（有些mac电脑拷贝相同系统就可以解决问题，取决于本机环境）

6.然后尝试在项目中打包 npm install ，报错变了

# 报错一

> node-sass@4.14.1 install /Users/eryajf/code/admin-front/node_modules/node-sass
> node scripts/install.js

Downloading binary from https://github.com/sass/node-sass/releases/download/v4.14.1/darwin-arm64-83_binding.node
Cannot download "https://github.com/sass/node-sass/releases/download/v4.14.1/darwin-arm64-83_binding.node":

HTTP error 404 Not Found

...... 有裁剪

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! node-sass@4.14.1 postinstall: `node scripts/build.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the node-sass@4.14.1 postinstall script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

# 报错二
gyp verb check python checking for Python executable "python2" in the PATH
gyp verb `which` failed Error: not found: python2
gyp verb `which` failed     at getNotFoundError (/Users/eryajf/code/admin-front/node_modules/which/which.js:13:12)
gyp verb `which` failed     at F (/Users/eryajf/code/admin-front/node_modules/which/which.js:68:19)
gyp verb `which` failed     at E (/Users/eryajf/code/admin-front/node_modules/which/which.js:80:29)
gyp verb `which` failed     at /Users/eryajf/code/admin-front/node_modules/which/which.js:89:16
gyp verb `which` failed     at /Users/eryajf/code/admin-front/node_modules/isexe/index.js:42:5
gyp verb `which` failed     at /Users/eryajf/code/admin-front/node_modules/isexe/mode.js:8:5
gyp verb `which` failed     at FSReqCallback.oncomplete (fs.js:192:21)
gyp verb `which` failed  python2 Error: not found: python2
gyp verb `which` failed     at getNotFoundError (/Users/eryajf/code/admin-front/node_modules/which/which.js:13:12)
gyp verb `which` failed     at F (/Users/eryajf/code/admin-front/node_modules/which/which.js:68:19)
gyp verb `which` failed     at E (/Users/eryajf/code/admin-front/node_modules/which/which.js:80:29)
gyp verb `which` failed     at /Users/eryajf/code/admin-front/node_modules/which/which.js:89:16
gyp verb `which` failed     at /Users/eryajf/code/admin-front/node_modules/isexe/index.js:42:5
gyp verb `which` failed     at /Users/eryajf/code/admin-front/node_modules/isexe/mode.js:8:5
gyp verb `which` failed     at FSReqCallback.oncomplete (fs.js:192:21) {
gyp verb `which` failed   code: 'ENOENT'
gyp verb `which` failed }
gyp verb check python checking for Python executable "python" in the PATH
gyp verb `which` succeeded python /usr/local/bin/python
gyp ERR! configure error
gyp ERR! stack Error: Command failed: /usr/local/bin/python -c import sys; print "%s.%s.%s" % sys.version_info[:3];
gyp ERR! stack   File "<string>", line 1
gyp ERR! stack     import sys; print "%s.%s.%s" % sys.version_info[:3];
gyp ERR! stack                       ^
gyp ERR! stack SyntaxError: invalid syntax
gyp ERR! stack
gyp ERR! stack     at ChildProcess.exithandler (child_process.js:383:12)
gyp ERR! stack     at ChildProcess.emit (events.js:400:28)
gyp ERR! stack     at maybeClose (internal/child_process.js:1088:16)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:296:5)
gyp ERR! System Darwin 21.6.0

如上报错分两个点，一个是 python 命令依赖 python2，一个是 node-saas 下载路径为 404。

我用的电脑是 Mac 的 M2 pro 版本，系统里边默认的 Python 是 v3 的版本，所以如上错误是一个随着时间推移而产生的一个问题。 可以通过如下方式安装 Python 的 v2 来解决这个问题： 网上有种解决方法：

brew install pyenv
pyenv install 2.7.18
pyenv global 2.7.18

将环境变量放入系统配置文件：

$ cat ~/.zshrc | grep pyenv
export PATH="$HOME/.pyenv/shims:$PATH"

查看 python

$ python
Python 2.7.18 (default, Jan  1 2024, 10:21:04)
[GCC Apple LLVM 14.0.0 (clang-1400.0.29.201)] on darwin
Type "help", "copyright", "credits" or "license" for more information.
>>>

一般到这里都会安装成功，但是我没有

如果你的电脑也是mac 终端默认执行zsh shell，最好在.zshrc里增加脚本：source .bash_profile 以兼容不小心加入 .bash_profile 文件的变量。

7. 报错又变了

错误： Error: Node Sass does not yet support your current environment: OS X Unsupported architecture (arm64) with Node.js 14.x For more information on which environments are supported please see: github.com/sass/node-s...

经过大佬指导，更换了源，遇到问题找人讨论是个事半功倍的方式。

一开始以为以为npm源的问题，尝试了代理外网，淘宝源，官方源等

官网：npm config set registry registry.npmjs.org/ 淘宝新源：npm config set registry registry.npmmirror.com 淘宝老源：npm config set registry registry.npm.taobao.org/ 华为云：mirrors.huaweicloud.com/repository/..."

都用了，不行，还可以用.npmrc文件改源，我当时用的是 npm config set registry 以及设置 sass_binary_site

网上有人说 要打开Rosetta，是个兼容性设置。这里有官网的介绍 Rosetta 找到应用程序的"终端" -> 点击显示简介 -> 在简介信息中勾选"使用 Rosetta 打开" -> 打开后重装 Node@14.16.0 -> 关闭终端。 重新安装。然而还是不行。

8. 打开 node- sass版本兼容性介绍： github.com/sass/node-s...

并没有问题，我们开始尝试修改node版本，15 16 等等，因为一直用的是14.18.1，其他window和mac都没问题，然后有尝试降低版本，直到降低到10.17.0 安装成功了🎆 done

-- EOND --