M1芯片MacOS Ventura系统下React环境搭建失败求助

问题描述 #

在M1芯片的Mac设备上首次搭建React环境，执行npx create-react-app my-app时触发报错，核心错误信息如下：

npm ERR! path /Users/abd/Desktop/React/my-app/node_modules/core-js-pure
npm ERR! command failed
npm ERR! signal SIGKILL
npm ERR! command sh -c -- node -e "try{require('./postinstall')}catch(e){}"

已尝试更新Node.js（v18.13.0）和npm（v8.19.3），问题仍未解决，完整报错日志：

6831 verbose stack Error: command failed
6831 verbose stack     at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/@npmcli/promise-spawn/lib/index.js:63:27)
6831 verbose stack     at ChildProcess.emit (node:events:513:28)
6831 verbose stack     at maybeClose (node:internal/child_process:1091:16)
6831 verbose stack     at Socket.<anonymous> (node:internal/child_process:449:11)
6831 verbose stack     at Socket.emit (node:events:513:28)
6831 verbose stack     at Pipe.<anonymous> (node:net:320:12)
6832 verbose pkgid core-js-pure@3.27.2
6833 verbose cwd /Users/abd/Desktop/React/my-app
6834 verbose Darwin 22.2.0
6835 verbose node v18.13.0
6836 verbose npm  v8.19.3
6837 error path /Users/abd/Desktop/React/my-app/node_modules/core-js-pure
6838 error command failed
6839 error signal SIGKILL
6840 error command sh -c -- node -e "try{require('./postinstall')}catch(e){}"
6841 verbose exit 1
6842 timing npm Completed in 147361ms
6843 verbose unfinished npm timer reify 1674722956943
6844 verbose unfinished npm timer reify:build 1674723102249
6845 verbose unfinished npm timer build 1674723102250
6846 verbose unfinished npm timer build:deps 1674723102250
6847 verbose unfinished npm timer build:run:postinstall 1674723102271
6848 verbose unfinished npm timer build:run:postinstall:node_modules/core-js 1674723102271
6849 verbose unfinished npm timer build:run:postinstall:node_modules/core-js-pure 1674723102275
6850 verbose code 1

原因分析 #

报错中的SIGKILL信号表示进程因系统资源不足被强制终止，M1 Mac上出现该问题主要有以下几个原因：

• 安装过程中create-react-app及依赖包占用大量内存，系统因内存不足杀死进程
• Node.js在M1原生架构下的兼容性问题，导致core-js-pure的postinstall脚本执行异常
• core-js-pure@3.27.2版本存在适配M1芯片的Bug

解决办法 #

1. 释放系统内存后重试 #

关闭后台闲置的应用程序，释放足够内存后，重新执行：

npx create-react-app my-app

2. 通过Rosetta兼容模式运行终端 #

1. 找到「终端」应用，右键选择「显示简介」
2. 勾选「使用Rosetta打开」选项
3. 重启终端，再次执行安装命令

3. 跳过postinstall脚本安装 #

执行安装时跳过所有包的postinstall脚本，避免触发报错：

npx create-react-app my-app --ignore-scripts

安装完成后进入项目目录，手动执行必要的脚本：

cd my-app
npm run postinstall

4. 指定兼容的core-js版本 #

先删除已创建的my-app目录，然后手动安装适配M1的core-js版本，再执行创建命令：

npm install core-js@3.26.0 --save
npx create-react-app my-app

内容的提问来源于stack exchange，提问作者Abhinav Dubey