Next.js项目执行npm i卡在idealTree阶段，求解决方案

问题描述 #

在Next.js项目目录执行npm i时卡在idealTree: timing idealTree Completed in XXXXms阶段，仅在Downloads/目录下出现该问题，其他目录运行正常。

已尝试无效的方案 #

• 将npm registry切换为http://
• 关闭strict-ssl
• 全局更新npm
• 卸载并重新安装Node.js
• 强制清理node缓存（npm cache clean --force）
• 终止后台运行的Node终端进程
• 配置PATH指向正确文件
• 删除node_modules/和package-lock.json

环境信息 #

• Node版本：18.14.0
• NPM版本：9.4.1
• 操作系统：Windows 11 Home Single-Language
• 系统版本：22H2
• 系统构建版本：22621.1194

项目package.json内容 #

{
  "name": "my-app",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start"
  },
  "dependencies": { 
    "next": "13.0.3",
    "react": "18.2.0",
    "react-dom": "18.2.0", 
  }
}

npm i详细日志 #

$ npm i -verbose
npm verb cli C:\Program Files\nodejs\node.exe C:\Users\aahan\AppData\Roaming\npm\node_modules\npm\bin\npm-cli.js
npm info using npm@9.4.1
npm info using node@v18.14.0
npm verb title npm i
npm verb argv "i" "--loglevel" "verbose"
npm verb logfile logs-max:10 dir:C:\Users\aahan\AppData\Local\npm-cache\_logs\2023-02-08T10_01_08_381Z-
npm verb logfile C:\Users\aahan\AppData\Local\npm-cache\_logs\2023-02-08T10_01_08_381Z-debug-0.log
npm http fetch GET 200 https://registry.npmjs.org/next 1267ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/fibers 339ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/node-sass 299ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/react 196ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/react-dom 274ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/sass 317ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/@next%2Fenv 410ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/@next%2Fswc-android-arm64 540ms (cache revalidated)    
npm http fetch GET 200 https://registry.npmjs.org/loose-envify 578ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/styled-jsx 613ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/use-sync-external-store 619ms (cache revalidated)      
npm http fetch GET 200 https://registry.npmjs.org/@next%2Fswc-linux-x64-gnu 626ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/@swc%2Fhelpers 720ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/@next%2Fswc-android-arm-eabi 716ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/scheduler 697ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/@next%2Fswc-linux-arm64-gnu 735ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/postcss 760ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/@next%2Fswc-freebsd-x64 758ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/@next%2Fswc-linux-arm64-musl 808ms (cache revalidated) 
npm http fetch GET 200 https://registry.npmjs.org/@next%2Fswc-linux-arm-gnueabihf 822ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/@next%2Fswc-darwin-arm64 840ms (cache revalidated)     
npm http fetch GET 200 https://registry.npmjs.org/@next%2Fswc-linux-x64-musl 844ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/@next%2Fswc-win32-ia32-msvc 863ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/@next%2Fswc-win32-arm64-msvc 880ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/@next%2Fswc-win32-x64-msvc 1086ms (cache revalidated)  
npm http fetch GET 200 https://registry.npmjs.org/caniuse-lite 1334ms (cache updated)
npm http fetch GET 200 https://registry.npmjs.org/@next%2Fswc-darwin-x64 2319ms (cache revalidated)      
npm http fetch GET 200 https://registry.npmjs.org/source-map-js 192ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/picocolors 199ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/nanoid 210ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/tslib 220ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/client-only 1262ms (cache revalidated)
npm http fetch GET 200 https://registry.npmjs.org/js-tokens 161ms (cache revalidated)
[#########.........] \ idealTree: timing idealTree Completed in 6984ms

有效解决建议 #

1. 检查Downloads目录权限 #

Windows的Downloads目录默认有严格的权限控制，可能阻止npm写入文件：

• 右键Downloads目录 → 属性 → 安全 → 编辑 → 确保当前用户拥有完全控制权限
• 应用设置后重新运行npm i

2. 移动项目到其他目录 #

既然仅Downloads目录有问题，直接将项目文件夹移动到桌面、Documents等权限更宽松的目录，再执行npm i

3. 修复package.json语法错误 #

你的package.json中dependencies最后一项react-dom后面多了一个逗号，会导致语法解析问题，修复后重新运行：

"dependencies": { 
  "next": "13.0.3",
  "react": "18.2.0",
  "react-dom": "18.2.0"  // 去掉此处多余的逗号
}

4. 临时禁用Windows Defender实时保护 #

部分杀毒软件会拦截npm的文件操作，临时关闭后尝试安装：

• 打开Windows安全中心 → 病毒和威胁防护 → 管理设置 → 关闭实时保护
• 完成安装后记得重新开启

5. 使用pnpm替代npm尝试 #

pnpm的缓存机制和文件操作逻辑与npm不同，可能绕过该问题：

• 全局安装pnpm：npm install -g pnpm
• 执行pnpm install安装依赖

内容的提问来源于stack exchange，提问作者Aahan Agarwal