This morning, I spent about four hours to migrate my client website to Gatsby v2. Why this time? Because recently, we need to make a query for a special type of data that our source API only supports v2. It won’t work with Gatsby v1 anymore.
After following gatsby migration guide to
- Update all the dependencies to support v2
- Install React
- Manually import Layout to wrap in each page and template
- Update Layout to support Static Query
- Convert to pure ES6 import
- Import Link from Gatsby
- Import graphql from Gatsby
- Also, update the
html.jsto match with v2 content. I have to use it on my project to make use of jQuery and Webflow.
- After these above changes, I also remove the
npm ione more time to make sure there are no caches or differences on the dependencies.
Life is not that easy, after finishing all of the above steps. I run
npm run develop and received tones of errors. I have to manually fix it, mostly came from the query of my API, which is hosted on DatoCMS
And after all of my efforts, I received the green line that I was expected.
But when I pushed to Netlify, I saw a weird message. I didn’t google right the way and I thought it was because my
gatsby-plugin-netlify was not up-to-date. And I tried upgrading it and deploy again, still the same error.
I google it and turned out it was because of Node version configuration on Netlify was not matched with the required version. See gatsby/issues/24389 for more detail.
I ended up fixing it by setting a higher Node.js version in Netlify by setting an environment variable
NODE_VERSION to value
That’s how I spent my weekend, almost five hours has gone…
What about you?