Gatsby for macOS Catalina (v10.15) - How to fix 'npm install' error

I’m a huge fan of using Gatsby and React to create super optimised and lightweight frontend web applications. With the release of macOS Catalina v10.15 my Gatsby projects (and other projects using node to manage packages) were suddenly causing normal node-gyp installations to fail.

Most notably when attempting to run an npm install:

gyp: No Xcode or CLT version detected!

After much trawling of the web I found a solution; to save you the hassle let me explain how to fix the issue in a few simple and concise steps:

To resolve this we need to install the latest release of node-gyp. As we’re running node-gyp through npm install we will install node-gyp globally and let npm know exactly where to find this new installation.

Step 1:

Install node-gyp globally on your local machine:

npm install -g node-gyp

Step 2:

In your project’s root directory, delete your .cache, node_modules and public folders (if they exist).

Step 3:

Spin up a terminal window in your project’s root directory and run npm install with an environment variable prefix:

npm_config_node_gyp='[path to node-gyp]' npm install

Replace [path to node-gyp] with the path to the node-gyp executable found in the installation directory on your local machine. This will likely be: /usr/local/lib/node_modules/node-gyp/bin/node-gyp.js

NB: You can also install node-gyp with the following approach:

npm config set node_gyp [path to node-gyp]

However, if you do this you are then fully responsible for keeping your local version of node-gyp up-to-date. npm will not update this file when a new version becomes available.

If you choose to do this, you can unset this configuration option by running the following command:

npm config delete node_gyp

Step 4:

Start up your Gatsby (or other) development environment with:

gatsby develop

Additional issues:

You may now receive the following error:

Error: Cannot find module '../build/Release/sharp.node'

If you do, you need to repeat the above process of deleting your .cache, node_module and public folders, and re-running steps 2 & 3. This is a Catalina v10.15 specific issue and will hopefully be fixed in a later macOS release.