Gatsby构建生产环境JavaScript与CSS bundles时失败问题求助

解决方案排查步骤 #

• 先清理所有缓存与冗余文件：删除项目下的.cache、public、node_modules文件夹，以及package-lock.json（npm用户）或yarn.lock（yarn用户）。执行缓存清理命令后重装依赖：
  npm用户执行：

  npm cache clean --force
  npm install
  

  yarn用户执行：

  yarn cache clean
  yarn install
  

  依赖安装完成后先执行gatsby clean清理Gatsby内部缓存，再执行构建命令测试。
• 修正gatsby-config.js中的重复配置：你当前的配置里两次声明了name: images的gatsby-source-filesystem项，且指向的路径完全一致，重复的数据源定义会导致构建时节点生成冲突，删掉任意一个重复的配置即可。
• 检查Node版本与sass依赖兼容性：你使用的node-sass@6.0.0仅支持Node.js 14~16版本，如果你的运行环境（本地/CI）近期自动升级到了Node 17及以上版本，就会触发无代码改动的突发构建错误。建议直接弃用已经停止维护的node-sass，换成官方推荐的sass（dart-sass）：删掉package.json中的node-sass依赖，新增sass: ^1.43.0后重装依赖即可。
• 加大Node构建内存上限：大型Gatsby项目构建时容易出现内存溢出问题，可在执行构建命令时手动加大内存限制：
  类Unix系统执行：

  NODE_OPTIONS="--max-old-space-size=4096" gatsby build
  

  Windows系统执行：

  set NODE_OPTIONS=--max-old-space-size=4096
  gatsby build
  

• 对齐Gatsby官方插件版本：你当前使用的Gatsby核心版本为3.6.2，但gatsby-plugin-remove-trailing-slashes等插件版本为3.11.0，高于核心版本。Gatsby官方插件需要和核心版本保持一致才能避免兼容问题，将所有gatsby-开头的插件版本都调整为和核心版本匹配的3.6.x版本即可。

内容的提问来源于stack exchange，提问作者Nikki Peel