Published in Technology on A Place For My Head. Tagged , , , & .

Quick note: if you want to use pnpm in your Netlify deploy, you can’t point npm at / to disable it. After the next time you clear your cache, it will try to install the modules and fail because of insufficient permissions. Rather, you need to use --prefix /dev/null.

I had to update my technique for a more recent project where I was surprised to learn Netlify still doesn’t support pnpm directly or offer any way to disable all the unnecessary dependency management. This hack disables the builtin npm install behaviour: 

[build.environment]
NPM_FLAGS="--version"

This installs the dependencies and builds the project using pnpm:

[build]
command = "npx pnpm@6 install --store-dir=.pnpm --frozen-lockfile && npx pnpm@6 build"

Note the --store-dir=.pnpm to allow caching dependencies.

The normal method of using the cache plugin would be:

# this does not work
[[plugins]]
package = "netlify-plugin-cache"

  [plugins.inputs]
  paths = [".pnpm"]

Unfortunately, disabling npm install means Netlify has no way to fetch the plugin in the first place, which it expects to be able to do before running the build command. I ended up having to use a Git submodule for the first time.[1] The netlify.toml can point at this ‘vendored’ version instead: 

[[plugins]]
package = "/netlify-plugin-cache"

  [plugins.inputs]
  paths = [".pnpm"]

In the end, caching dependencies (and some image processing too, now that I had set it up) took the build time for this project from around six minutes to one and a half, so it was well worth the effort.
  1. I’ve started down this route many times in the past only to realize I have better options.↩