Cassidy Williams

Software Engineer in Chicago

Cassidy's face

Making Puppeteer work at build time on Netlify


I wrote a Node script recently that installed Puppeteer, and that script ran at build time for a website I was working on.

When I ran npm run build locally, it worked just fine, but on Netlify, it failed silently.

When I looked at the logs, I found this error:

> Error: Could not find Chrome (ver. 137.0.7151.55). This can occur if either
> 1. you did not perform an installation before running the script (e.g. `npx puppeteer browsers install chrome`) or
> 2. your cache path is incorrectly configured (which is: /opt/buildhome/.cache/puppeteer).
> For (2), check out our guide on configuring puppeteer at https://pptr.dev/guides/configuration.
> at ChromeLauncher.resolveExecutablePath
> (file:///opt/build/repo/node_modules/puppeteer-core/lib/esm/puppeteer/node/BrowserLauncher.js:272:27)
> at ChromeLauncher.computeLaunchArguments (file:///opt/build/repo/node_modules/puppeteer-core/lib/esm/puppeteer/node/ChromeLauncher.js:85:24)
> at async ChromeLauncher.launch (file:///opt/build/repo/node_modules/puppeteer-core/lib/esm/puppeteer/node/BrowserLauncher.js:48:28)
...

After a bunch of trial and error and searching online for solutions I found two ways that worked:

The Chromium integration/build plugin

Install the Chromium integration in the Netlify UI, or in your netlify.toml:

[[plugins]]
package = "netlify-plugin-chromium"

The integration hooks into installation stage of my site’s build, and checks if Chromium is installed (and if not, installs it and adds a CHROME_PATH environment variable), and installs Chromium binaries if needed.

After hitting the “Enable integration” button, you can trigger a new build, and voilà, the Chromium missing error should be gone!

Via package.json

You can also install Chrome via a prebuild script in your package.json.

"scripts": {
  "prebuild": "npx puppeteer browsers install chrome",
	// ...
}

I personally noticed that I ran into some caching issues with the first option, but it might depend on your setup. Both of these options should work for serverless functions, too, if that’s where you’re running into the problem!

This was a really nice solution to not have to change any of my code to get it working! Hopefully this is helpful for ya!


View posts by tag

#advice #personal #musings #events #learning #work #technical #meta