Macbook M1&M2 芯片安装node-sass终极解决方案,百试不爽

1,403 阅读1分钟

安装失败无非两个原因:

  1. node版本与node-sass不兼容
  2. m1&m2架构与node-sass不兼容

针对node版本与node-sass不兼容

NodeJSMinimum node-sass versionNode Module
Node 144.14+83
Node 134.13+79
Node 124.12+72
Node 114.10+67
Node 104.9+64
Node 84.5.3+57

思路很简单,根据你项目里package.jsonnode-sass的版本,使用nvm切换到对应的node版本即可。

针对m1&m2架构与node-sass不兼容

需要使用Rosetta模拟x86架构,在我无限的查询百度、谷歌和github的issue之后,最终在成功安装node-sass的项目里,从node_modules里找到node-sass的目录,其中在README.md中发现了关键的代码:

npm install -g mirror-config-china --registry=http://registry.npm.taobao.org
npm install node-sass

然后恍然大悟。

注:因为我用的node-sass的版本比较低,上面的淘宝镜像并不是最新的

终极解决步骤

全部的操作使用iterm进行,如果要使用vscode的终端,需要配置settings.json,自行百度吧,我就不贴了。

前置操作:

  1. 以Rosetta的方式打开iterm
  2. brew install pyenv
  3. pyenv install 2.7.18
  4. pyenv global 2.7.18
  5. export PATH="$(pyenv root)/shims:${PATH}"
  6. echo 'PATH=$(pyenv root)/shims:$PATH' >> ~/.zshrc

注:如果省略前置操作,不确定会不会影响后续的安装

核心操作:(我的node-sass版本是4.14.1,所以需要使用node14的版本)

  1. Rosetta的方式打开iterm
  2. 安装nvm
  3. nvm uninstall 14
  4. nvm install v14
  5. rm -rf node_modules
  6. npm install -g mirror-config-china --registry=https://registry.npmmirror.com
  7. npm install -D node-sass
  8. npm install

image.png

结语

我找了三个不同的项目,按上面的终极解决方案一步一步的执行,全部成功安装,并正常运行。