Mac mini M1 和 Macbook Pro 15(2018 i7) 寸前端 webpack 编译对比

[ChasLui]

虽然在 node-gyp 编译 node-canvas 吃了点苦头, 但是 m1 真香

npm run dev

Macbook Pro 首次启动 97187ms Mac mini 首次启动 38979ms

[ChasLui]

配置对比

https://raw.githubusercontent.com/ChasLui/blog/master/assets/img/abtoumini.png

https://raw.githubusercontent.com/ChasLui/blog/master/assets/img/aboutmbp.png

[MichealXie]

我的配置跟你一模一样，牛逼，就等我的 mini 到了

[YYYeung]

搭车问一个，话说 mini 好像是有风扇的吧，所以猛起来的话，性能是跟 M1 的 mbp 一样的咯？

[ChasLui]

@YYYeung 两天了我就没听到过风扇声

[allele]

楼主 我也遇到了「 node-gyp 编译 node-canvas 」的问题。请问你是怎么解决的？谢谢

[allele]

@allele 鉴于楼主还没有回答我，我先自己回答一下我自己，以便后面搜到这个帖子的人可以看到。研究之后发现流程大概是这样的。
m1 原生的 node 版本是 15，根据这个 issue （ https://github.com/Automattic/node-canvas/issues/1688 ），node15 没有发布 canvas 的二进制版本。所以根据它的指示（ https://github.com/Automattic/node-canvas#compiling ）要从源码编译。
但是还没完，如果你的 homebrew 也是 m1 原生的，那么 homebrew 会安装在 /opt/homebrew 下。而 brew install 的东西都会在 /opt/homebrew/Cellar/下，不会软链接到 /usr/local/include 下。而 node-gyp 去编译的时候，本质上还是用 clang 去编译，找不到头文件，所以会报一个“fatal error: 'jpeglib.h' file not found”。解决的办法就是把 /opt/homebrew/Cellar/加到 clang 的 include path 里。我的做法是在~/.zshrc 中加入一行“export CPLUS_INCLUDE_PATH=/opt/homebrew/include”。这样这个问题就解决了。
但是由于 npm 的版本是 7，在最后 npm run dev 的时候会因为没有 process.env.npm_config_argv ( https://github.com/npm/cli/issues/1995)又报错。最后可能需要根据自己的需要去修改配置文件。
至此，项目是可以正常打开的。但是后面有没有别的问题还不得而知。