After migrating from Remark to MDX, my builds on Netlify are failing.
I get this error when trying to build:
10:13:28 AM: $ npm run build
10:13:29 AM: > [email protected] build /opt/build/repo
10:13:29 AM: > gatsby build
10:13:30 AM: error Gatsby requires Node.js 14.15.0 or higher (you have v12.18.0).
10:13:30 AM: Upgrade Node to the latest stable release: https://gatsby.dev/upgrading-node-js
Yet when I run node -v in my terminal, it says v17.2.0.
I assume it's not a coincidence that this happened after migrating. Can the problem be because of my node-modules folder? Or is there something in my gatsby-config.js or package.json files I need to change?
My package.json file:
{
"name": "blog-gatsby",
"private": true,
"description": "A starter for a blog powered by Gatsby and Markdown",
"version": "0.1.0",
"author": "Magnus Kolstad <[email protected]>",
"bugs": {
"url": "https://kolstadmagnus.no"
},
"dependencies": {
"@mdx-js/mdx": "^1.6.22",
"@mdx-js/react": "^1.6.22",
"gatsby": "^4.3.0",
"gatsby-plugin-feed": "^4.3.0",
"gatsby-plugin-gatsby-cloud": "^4.3.0",
"gatsby-plugin-google-analytics": "^4.3.0",
"gatsby-plugin-image": "^2.3.0",
"gatsby-plugin-manifest": "^4.3.0",
"gatsby-plugin-mdx": "^3.4.0",
"gatsby-plugin-offline": "^5.3.0",
"gatsby-plugin-react-helmet": "^5.3.0",
"gatsby-plugin-sharp": "^4.3.0",
"gatsby-remark-copy-linked-files": "^5.3.0",
"gatsby-remark-images": "^6.3.0",
"gatsby-remark-prismjs": "^6.3.0",
"gatsby-remark-responsive-iframe": "^5.3.0",
"gatsby-remark-smartypants": "^5.3.0",
"gatsby-source-filesystem": "^4.3.0",
"gatsby-transformer-sharp": "^4.3.0",
"prismjs": "^1.25.0",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-helmet": "^6.1.0",
"typeface-merriweather": "0.0.72",
"typeface-montserrat": "0.0.75"
},
"devDependencies": {
"prettier": "^2.4.1"
},
"homepage": "https://kolstadmagnus.no",
"keywords": [
"blog"
],
"license": "0BSD",
"main": "n/a",
"repository": {
"type": "git",
"url": "git+https://github.com/gatsbyjs/gatsby-starter-blog.git"
},
"scripts": {
"build": "gatsby build",
"develop": "gatsby develop",
"format": "prettier --write \"**/*.{js,jsx,ts,tsx,json,md}\"",
"start": "gatsby develop",
"serve": "gatsby serve",
"clean": "gatsby clean",
"test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\" && exit 1"
}
}
What am I doing wrong here?
Update #1
7:11:59 PM: failed Building production JavaScript and CSS bundles - 20.650s
7:11:59 PM: error Generating JavaScript bundles failed
7:11:59 PM: Module build failed (from ./node_modules/url-loader/dist/cjs.js):
7:11:59 PM: Error: error:0308010C:digital envelope routines::unsupported
7:11:59 PM: at new Hash (node:internal/crypto/hash:67:19)
7:11:59 PM: at Object.createHash (node:crypto:130:10)
7:11:59 PM: at getHashDigest (/opt/build/repo/node_modules/file-loader/node_modules/loader-utils/lib/getHashDigest.js:46:34)
7:11:59 PM: at /opt/build/repo/node_modules/file-loader/node_modules/loader-utils/lib/interpolateName.js:113:11
7:11:59 PM: at String.replace (<anonymous>)
7:11:59 PM: at interpolateName (/opt/build/repo/node_modules/file-loader/node_modules/loader-utils/lib/interpolateName.js:110:8)
7:11:59 PM: at Object.loader (/opt/build/repo/node_modules/file-loader/dist/index.js:29:48)
7:11:59 PM: at Object.loader (/opt/build/repo/node_modules/url-loader/dist/index.js:127:19)
7:11:59 PM:
7:11:59 PM: ────────────────────────────────────────────────────────────────
7:11:59 PM: "build.command" failed
7:11:59 PM: ────────────────────────────────────────────────────────────────
7:11:59 PM:
7:11:59 PM: Error message
7:11:59 PM: Command failed with exit code 1: npm run build
7:11:59 PM:
7:11:59 PM: Error location
7:11:59 PM: In Build command from Netlify app:
7:11:59 PM: npm run build
7:11:59 PM:
7:11:59 PM: Resolved config
7:11:59 PM: build:
7:11:59 PM: command: npm run build
7:11:59 PM: commandOrigin: ui
7:11:59 PM: publish: /opt/build/repo/public
7:11:59 PM: publishOrigin: ui
7:11:59 PM: plugins:
7:11:59 PM: - inputs: {}
7:11:59 PM: origin: ui
7:11:59 PM: package: '@netlify/plugin-gatsby'
7:11:59 PM: redirects:
7:12:00 PM: - from: /api/*
status: 200
to: /.netlify/functions/gatsby
- force: true
from: https://magnuskolstad.com
status: 301
to: https://kolstadmagnus.no
redirectsOrigin: config
Caching artifacts