Rails7项目中esbuild代码分割在CI/Heroku环境超时问题

AI 小北

2026-8-15

Rails 7 + esbuild 部署超时/卡住问题解决方案

你的问题根源在于esbuild配置里的watch: true——这个选项会让esbuild进程持续运行，监听文件变化，而CI（GitHub Actions）和Heroku的构建任务需要一次性执行完成，进程不会自动退出，最终导致超时或卡住。

1. 区分开发/生产构建命令

修改package.json的scripts，拆分开发和生产环境的构建命令：

"scripts": {
  "build": "NODE_ENV=production node app/assets/config/esbuild.js",
  "build:dev": "node app/assets/config/esbuild.js",
  "build:css": "sass ./app/assets/stylesheets/application.sass.scss ./app/assets/builds/application.css --no-source-map --load-path=node_modules",
  "build:css:dev": "sass ./app/assets/stylesheets/application.sass.scss ./app/assets/builds/application.css --source-map --load-path=node_modules"
}

build：生产环境构建（无watch、开启压缩）
build:dev：开发环境构建（保留watch）
build:css：生产环境CSS构建（关闭sourcemap）
build:css:dev：开发环境CSS构建（开启sourcemap）

2. 修改esbuild配置，根据环境变量控制行为

更新app/assets/config/esbuild.js，通过环境变量判断是否开启watch和压缩：

const path = require('path');
const isProduction = process.env.NODE_ENV === 'production';

require("esbuild").build({
  entryPoints: ["stimulus.js","article.js"],
  bundle: true,
  minify: isProduction, // 仅生产环境开启代码压缩
  outdir: path.join(process.cwd(), "app/assets/builds"),
  absWorkingDir: path.join(process.cwd(), "app/javascript"),
  watch: !isProduction, // 仅开发环境开启文件监听
  loader: { '.js': 'jsx' },
  publicPath: 'assets',
  target: 'es6',
  plugins: [],
}).catch(() => process.exit(1));