Rails 6部署因编译失败中断 Babel配置与caniuse-lite问题排查

编译阶段输出的caniuse-lite过期提示、Babel loose配置冲突提示均为警告级日志，不会直接导致编译中断，之前操作无效是因为未处理真正的阻塞点，按以下步骤操作即可恢复正常编译：

消除冗余Babel配置警告 #

重复输出60次的Babel警告是因为三个类属性相关提案插件的loose配置值不统一导致的，打开项目根目录下的babel.config.js文件，在plugins配置项中补充统一配置，保证三个插件的loose值完全一致：

// babel.config.js 配置示例
module.exports = {
  presets: [
    '@babel/preset-env'
  ],
  plugins: [
    ["@babel/plugin-proposal-class-properties", { "loose": true }],
    ["@babel/plugin-proposal-private-methods", { "loose": true }],
    ["@babel/plugin-proposal-private-property-in-object", { "loose": true }]
  ]
}

如果是Rails Webpacker默认生成的配置，没有手动声明过上述插件，直接把三个插件项加入plugins数组即可，配置完成后重复的Babel警告会完全消失。

修复browserslist/caniuse-lite过期提示 #

Rails 6的Webpacker默认使用yarn管理前端依赖，之前执行npm命令不会生效，在项目根目录执行以下命令更新对应依赖即可：

yarn upgrade caniuse-lite browserslist
npx browserslist@latest --update-db

执行完成后caniuse-lite过期提示会消失。

定位并修复真正的编译阻塞点 #

警告消除后，Webpack日志不会被大量冗余信息冲掉，此时如果编译依然中断，直接在项目根目录手动执行生产环境编译命令，即可拿到完整的错误栈：

RAILS_ENV=production bundle exec rails webpacker:compile

无新依赖安装、无代码变动情况下突发编译中断的常见原因和对应处理方式：

• 部署环境Node.js版本与本地开发大版本不匹配：比如本地使用Node 16，服务器使用Node 12，会出现语法兼容问题导致编译进程退出，将两端Node.js大版本统一即可
• 服务器端依赖缓存损坏：删除项目下的node_modules目录和yarn.lock文件，重新执行yarn install后再编译即可
• 部署服务器磁盘空间不足：资源文件写入失败导致编译中断，清理磁盘剩余空间后重试即可
• 资源文件存在隐藏语法错误：手动编译命令会直接输出出错的文件路径、行号和错误原因，对应修正语法问题即可

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