You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Mac本地部署Gatsby电商主题时npm install失败求助

求助:Mac OS本地部署gatsby-ecommerce-theme时npm install报错

我正尝试在Mac OS(M1芯片)本地部署gatsby-ecommerce-theme仓库,严格按照说明操作,但执行sudo npm install时出现报错,错误日志如下:

maxdenhoed@m1-macbook-pro gatsby-ecommerce-theme % sudo npm install
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: react-server-dom-webpack@0.0.0-experimental-c8b778b7f-20220825
npm WARN Found: react@18.2.0
npm WARN node_modules/react
npm WARN   react@"^18.0.0" from the root project
npm WARN   8 more (@gatsbyjs/reach-router, gatsby, gatsby-link, ...)
npm WARN 
npm WARN Could not resolve dependency:
npm WARN peer react@"0.0.0-experimental-c8b778b7f-20220825" from react-server-dom-webpack@0.0.0-experimental-c8b778b7f-20220825
npm WARN node_modules/react-server-dom-webpack
npm WARN   react-server-dom-webpack@"0.0.0-experimental-c8b778b7f-20220825" from gatsby@4.25.0
npm WARN   node_modules/gatsby
npm WARN 
npm WARN Conflicting peer dependency: react@0.0.0-experimental-c8b778b7f-20220825
npm WARN node_modules/react
npm WARN   peer react@"0.0.0-experimental-c8b778b7f-20220825" from react-server-dom-webpack@0.0.0-experimental-c8b778b7f-20220825
npm WARN   node_modules/react-server-dom-webpack
npm WARN     react-server-dom-webpack@"0.0.0-experimental-c8b778b7f-20220825" from gatsby@4.25.0
npm WARN     node_modules/gatsby
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: react-side-effect@2.1.1
npm WARN Found: react@18.2.0
npm WARN node_modules/react
npm WARN   react@"^18.0.0" from the root project
npm WARN   8 more (@gatsbyjs/reach-router, gatsby, gatsby-link, ...)
npm WARN 
npm WARN Could not resolve dependency:
npm WARN peer react@"^16.3.0 || ^17.0.0" from react-side-effect@2.1.1
npm WARN node_modules/react-side-effect
npm WARN   react-side-effect@"^2.1.0" from react-helmet@6.1.0
npm WARN   node_modules/react-helmet
npm WARN 
npm WARN Conflicting peer dependency: react@17.0.2
npm WARN node_modules/react
npm WARN   peer react@"^16.3.0 || ^17.0.0" from react-side-effect@2.1.1
npm WARN   node_modules/react-side-effect
npm WARN     react-side-effect@"^2.1.0" from react-helmet@6.1.0
npm WARN     node_modules/react-helmet
npm WARN deprecated querystring@0.2.1: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm WARN deprecated puppeteer@7.1.0: Version no longer supported. Upgrade to @latest
npm WARN deprecated devcert@1.2.0: critical regex denial of service bug fixed in 1.2.1 patch
npm WARN deprecated babel-eslint@10.1.0: babel-eslint is now @babel/eslint-parser. This package will no longer receive updates.
npm WARN deprecated async-cache@1.1.0: No longer maintained. Use [lru-cache](http://npm.im/lru-cache) version 7.6 or higher, and provide an asynchronous `fetchMethod` option.
npm WARN deprecated debug@4.1.1: Debug versions >=3.2.0 <3.2.7 || >=4 <4.3.1 have a low-severity ReDos regression when used in a Node.js environment. It is recommended you upgrade to 3.2.7 or 4.3.1. (https://github.com/visionmedia/debug/issues/797)
npm WARN cleanup Failed to remove some directories [
npm WARN cleanup   [
npm WARN cleanup     '/Users/maxdenhoed/Documents/1. Projects/GoReach/website2/gatsby-ecommerce-theme/node_modules/msgpackr-extract',
npm WARN cleanup     [Error: ENOTEMPTY: directory not empty, rmdir '/Users/maxdenhoed/Documents/1. Projects/GoReach/website2/gatsby-ecommerce-theme/node_modules/msgpackr-extract'] {
npm WARN cleanup       errno: -66,
npm WARN cleanup       code: 'ENOTEMPTY',
npm WARN cleanup       syscall: 'rmdir',
npm WARN cleanup       path: '/Users/maxdenhoed/Documents/1. Projects/GoReach/website2/gatsby-ecommerce-theme/node_modules/msgpackr-extract'
npm WARN cleanup     }
npm WARN cleanup   ],
npm WARN cleanup   [
npm WARN cleanup     '/Users/maxdenhoed/Documents/1. Projects/GoReach/website2/gatsby-ecommerce-theme/node_modules/sharp',
npm WARN cleanup     [Error: ENOTEMPTY: directory not empty, rmdir '/Users/maxdenhoed/Documents/1. Projects/GoReach/website2/gatsby-ecommerce-theme/node_modules/sharp'] {
npm WARN cleanup       errno: -66,
npm WARN cleanup       code: 'ENOTEMPTY',
npm WARN cleanup       syscall: 'rmdir',
npm WARN cleanup       path: '/Users/maxdenhoed/Documents/1. Projects/GoReach/website2/gatsby-ecommerce-theme/node_modules/sharp'
npm WARN cleanup     }
npm WARN cleanup   ],
npm WARN cleanup   [
npm WARN cleanup     '/Users/maxdenhoed/Documents/1. Projects/GoReach/website2/gatsby-ecommerce-theme/node_modules/sharp',
npm WARN cleanup     [Error: ENOTEMPTY: directory not empty, rmdir '/Users/maxdenhoed/Documents/1. Projects/GoReach/website2/gatsby-ecommerce-theme/node_modules/sharp'] {
npm WARN cleanup       errno: -66,
npm WARN cleanup       code: 'ENOTEMPTY',
npm WARN cleanup       syscall: 'rmdir',
npm WARN cleanup       path: '/Users/maxdenhoed/Documents/1. Projects/GoReach/website2/gatsby-ecommerce-theme/node_modules/sharp'
npm WARN cleanup     }
npm WARN cleanup   ]
npm WARN cleanup ]
npm ERR! code 1
npm ERR! path /Users/maxdenhoed/Documents/1. Projects/GoReach/website2/gatsby-ecommerce-theme/node_modules/puppeteer
npm ERR! command failed
npm ERR! command sh -c node install.js
npm ERR! The chromium binary is not available for arm64.
npm ERR! If you are on Ubuntu, you can install with: 
npm ERR! 
npm ERR!  sudo apt install chromium
npm ERR! 
npm ERR! 
npm ERR!  sudo apt install chromium-browser
npm ERR! 
npm ERR! /Users/maxdenhoed/Documents/1. Projects/GoReach/website2/gatsby-ecommerce-theme/node_modules/puppeteer/lib/cjs/puppeteer/node/BrowserFetcher.js:115
npm ERR!                     throw new Error();
npm ERR!                     ^
npm ERR! 
npm ERR! Error
npm ERR!     at /Users/maxdenhoed/Documents/1. Projects/GoReach/website2/gatsby-ecommerce-theme/node_modules/puppeteer/lib/cjs/puppeteer/node/BrowserFetcher.js:115:27
npm ERR!     at FSReqCallback.oncomplete (node:fs:207:21)
npm ERR! 
npm ERR! Node.js v18.13.0

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/maxdenhoed/.npm/_logs/2023-01-07T08_56_09_427Z-debug-0.log

我的初步分析:
安装sharp和msgpackr-extract包时出现目录无法删除的错误(提示ENOTEMPTY),可能是之前的安装残留或进程占用导致。但最终导致安装失败的核心原因是puppeteer@7.1.0不支持arm64架构(M1 Mac),无法下载对应Chromium二进制文件。


解决方案

1. 彻底清理安装残留

先把所有旧的安装文件和缓存清干净:

  • 关闭所有可能占用node_modules的程序(比如VS Code、终端里的npm进程)
  • 执行命令删除目录和锁文件:
    rm -rf node_modules
    rm package-lock.json
    
  • 清理npm缓存:
    npm cache clean --force
    

2. 解决Puppeteer的arm64兼容问题

选以下两种方案之一:

方案一:升级Puppeteer版本
编辑项目的package.json,把puppeteer的版本从7.1.0改成^10.0.0(或更高版本,这些版本原生支持M1 Mac),然后重新执行:

npm install

方案二:跳过Chromium下载,使用系统已安装的Chrome
先在Mac上安装Google Chrome,然后执行以下命令安装依赖(指定使用系统Chrome):

PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true PUPPETEER_EXECUTABLE_PATH=/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome npm install

3. 处理peer依赖警告(可选)

如果要解决那些react版本冲突的警告,可以在package.json里添加overrides字段(需要npm 8.3及以上版本):

"overrides": {
  "react-server-dom-webpack": {
    "react": "^18.2.0"
  },
  "react-side-effect": {
    "react": "^18.2.0"
  }
}

添加后重新执行npm install即可覆盖冲突的peer依赖要求。


内容的提问来源于stack exchange,提问作者Max den Hoed

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.06 04:01:07