Setting update Gatsby Development on an M1 Mac Mini

June 1, 2021

Setting up a new M1 Chip Mac for JavaScript development is straightforward as of June 1st, 2021! Previously, I'd read about the new M1 Chip difficulties during setup and common apps that weren't supported.

This post will troubleshoot minor issues I had setting up Gatsby to develop, write and publish this post on my new M1 Chip Mac—specifically issues I had with Node and Sharp.

Gatsby Dev Woes

After cloning a Gatsby repo, I attempted the setting Gatsby development to write this post as I'd done before.

nvm i && yarn && yarn develop

The chain of commands above led to a few errors in my terminal.

First, I observed that if I wasn't using Node 16, NVM seemed to endlessly try and install Node 14. To solve this issue, I bumped the version of Node in my .nvmrc to 16 and everything worked fine.

Second, during NPM node module installation, I encountered errors with "pre-built or built binaries". Sharp is one of the node modules which was causing the error. Sharp uses pre-built binaries to do image compression. To solve the "pre-built or built binaries" issues with Sharp, I Installed Homebrew and some Homebrew formulas. Then I removed some folders and re-build my Gatsby app which go everything running.

Homebrew setup

Maybe you haven't heard of Homebrew or don't use it. If you have a particular reason not to use Homebrew setting up your M1 Chip Mac for Gatsby development might be a bit more difficult.

Setting up Homebrew takes seconds. Read more about Homebrew here to decide if you'd like to set it up on your computer.

After setting up Homebrew, formulas must be installed for Sharp or other packages to work. These Homebrew formulas are for using npm packages that require built binaries. A quick browser search can provide more detail but here are few links to save time and gain context: Can't compile under Apple Silicon M1 arm64, Mismatched x64 and ARM64 architectures on M1 Mac, Can't install Sharp. The following command installs the Homebrew formulas required for Sharp to work.

Specificallly, I believe I had to install Vips:

brew install node vips

Ship it

After installing the necessary Homebrew formulas for Sharp to work, I needed to clear cached Gatsby folders and build the application fresh.

To clear my Gatsby app, I ran:

rimraf node_modules .cache public
# or if you don't have rimraf globally installed
rm -rf node_modules .cache public

And then re-installed:

yarn
# or via npm
npm i
# or via my current fav
pnpm i

And then re-built my Gatsby app:

yarn start

Final thoughts

M1 Macs are less expensive than Intel Macs because of Computer Chip Shortages, currently. I was concerned my MI Mac Mini would slow my development down because of bugs. Thankfully, I've had relatively no issues!

In this post, I hopefully provided some context into setting up an M1 Mac for Gatsby development and one happy path to get up and running with Gatsby on an M1 Mac fast!