Gatsby 5 was released recently, and I’ve been neglecting my blog rewrite. Let’s find out what’s new in the newest of the new Gatsby, and let’s also find out if I can upgrade my in-progress code base from Gatsby 4 to 5 without too much pain.
Nice to Meet You, Gatsby 5
Here it is, hot off the presses: Gatsby 5
The fastest Gatsby yet, you say?
What’s New?
Let’s crack open the box and see what we’ve got here.
Okay, looks like a lot, and a lot that’s going to require digging:
Slice API
Slice API: build and deploy only the bits that have changed, not entire site!
Partial Hydration
Partial Hydration: selective interactivity to improve efficiency and performance, leaving the rest of the pages static. There’s lots to dig into here, but I’ll leave that for later.
Head API
Head API: add elements to your document head, making SEO easier.
Script API
Script API: apply a loading strategy and load your scripts performantly.
Can I Upgrade My In-Progress Blog?
I’m glad you asked! What about if I cannot remember where I even left off, or what I was doing?
Let’s find out.
The Good News
Gatsby has a lovely upgrade guide, and it didn’t look bad at all.
The Reality
Trying to run the upgrade for Gatsby and for React, I was met with a litany of errors around dependency issues.
While the guide says if you run into these errors, run with the legacy peer deps parameter:
npm install gatsby@latest --legacy-peer-deps
Yes, I read the doc. I still thought it was worth a shot.
Running with that parameter, everything went smooth, and before long, I had my half-formed blog up and running again via
gatsby develop
Next Steps
In Gatsby 4.15, they introduced GraphQL Typegen. I was using a third party library to do the same pre-4.15, so I uninstalled the dependency, followed the guide above, deleted the old type files, and updated the references, and all was well in the world again.
Another easy win!
Other Weirdness
While upgrading other packages, I found my I was getting errors around references to slug from gatsby-plugin-mdx.
There’s a lovely post on the breaking changes which I followed, and with that, I was done.
V4 to V5 success!
Wrap Up
Gatsby 5 has a load of awesome new features, it’s faster, and upgrading is easy.
If you’re worried about upgrading, don’t. Follow the guides, and you’ll be fine.
Jump in and have fun static siting!
One day, I’ll finish and unveil the new site and not just tinker.
Maybe.