背景
在 React 项目做 SSR 时，除了 Next.JS 之外，如果项目只涉及静态展示页面，没有后端服务优化的需求，也可以使用预渲染的方式。目前有一些库都可以实现，比如 vite-plugin-prerender、react-snap、vite-plugin-ssr等。这些类库的一个共同特点是，底层都依赖 Puppeteer。
环境
Docker CentOS 7无外网访问能力
相关报错：
Failed to set up Chromium r856583! Set "PUPPETEER_SKIP_DOWNLOAD" env variable to skip download.
解决方案
- 手动安装 Puppeteer低版本。低版本是为了规避
CentOS 7的一个问题，如果不是这个版本可以尝试需要的版本。
npm install puppeteer@1.12.2
// 如果报错安装如下命令跳过安装chrome部分，一会儿我们手动安装
npm install --ignore-scripts puppeteer@1.12.2
- 下载对应版本的chromium版本。可以参考这个文档：pptr.dev/supported-b…
- 将下载好的chromium放到
/node_modules/puppeteer（如果这个是子依赖，需要放到子依赖的下述文件夹中）/.local-chromium/linux-624492/。这里linux-624492是我的版本的puppeteer所依赖的版本。这个值可以从puppeteer/package.json中puppeteer.chromium_revision获得。 - 解压chromium到当前文件夹
- 安装Chrome相关依赖。具体可以参考官方trouble shooting pptr.dev/troubleshoo… 。
问题
Chromium revision is not downloaded. Run "npm install" or "yarn install".
没有安装Chromium。需要正常安装Puppeteer之后手动安装Chromium之后放到对应文件夹下。
Failed to set up Chromium r856583! Set "PUPPETEER_SKIP_DOWNLOAD" env variable to skip download.
这个问题是Docker中访问外网导致的。如果可以设置网络代理，可以快速解决问题；如果不能，需要手动安装Chromium。
注意上面标识的Chromium放置文件夹是需要根据系统内核有所区别。 除了Linux内核，其他的位置可以正常安装时，通过报错找到位置文件夹。
如果安装后仍然报错找不到对应的Chromium版本，可能是Chromium没有放到正确的文件夹，或者版本和 Puppeteer 所寻找的版本不匹配。
Error: Failed to launch the browser process!
高版本 Chrome 在 CentOS 7 上有一个不能解决的系统依赖，对应上方解决方案 - 步骤5中的子依赖 - zygote_host_impl_linux。所以才有降级Puppeteer版本从而降级其对应的Chromium版本的方案。这里当然可以按照puppeteer支持文档所述，逐版本降级找到最高的可用版本。
总结
在我的场景下，当然最好的情况是制作一个docker镜像，内置对应版本Chrome和所有依赖都安装完，不需要在每次pipeline执行的时候都安装环境和拉Chromium。
