I got this error when learning Next.js, using npx create-next-app
command according to site documentation here https://nextjs.org/docs/api-reference/create-next-app. Everything works until I start the server,
Error stack:
$ npm run dev
> [email protected] dev
> next dev
ready - started server on 0.0.0.0:3000, url: http://localhost:3000
info - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5
Error: error:0308010C:digital envelope routines::unsupported
at new Hash (node:internal/crypto/hash:67:19)
at Object.createHash (node:crypto:130:10)
at BulkUpdateDecorator.hashFactory (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:138971:18)
at BulkUpdateDecorator.update (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:138872:50)
at OriginalSource.updateHash (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack-sources3\index.js:1:10264)
at NormalModule._initBuildHash (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:68468:17)
at handleParseResult (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:68534:10)
at C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:68628:4
at processResult (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:68343:11)
at C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:68407:5
Error: error:0308010C:digital envelope routines::unsupported
at new Hash (node:internal/crypto/hash:67:19)
at Object.createHash (node:crypto:130:10)
at BulkUpdateDecorator.hashFactory (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:138971:18)
at BulkUpdateDecorator.update (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:138872:50)
at OriginalSource.updateHash (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack-sources3\index.js:1:10264)
at NormalModule._initBuildHash (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:68468:17)
at handleParseResult (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:68534:10)
at C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:68628:4
at processResult (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:68343:11)
at C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:68407:5
node:internal/crypto/hash:67
this[kHandle] = new _Hash(algorithm, xofLen);
^
Error: error:0308010C:digital envelope routines::unsupported
at new Hash (node:internal/crypto/hash:67:19)
at Object.createHash (node:crypto:130:10)
at BulkUpdateDecorator.hashFactory (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:138971:18)
at BulkUpdateDecorator.update (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:138872:50)
at OriginalSource.updateHash (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack-sources3\index.js:1:10264)
at NormalModule._initBuildHash (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:68468:17)
at handleParseResult (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:68534:10)
at C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:68628:4
at processResult (C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:68343:11)
at C:\xampp\htdocs\devto-clone\node_modules\next\dist\compiled\webpack\bundle5.js:68407:5 {
opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
library: 'digital envelope routines',
reason: 'unsupported',
code: 'ERR_OSSL_EVP_UNSUPPORTED'
}
Node.js v17.0.1
package.json :
{
"name": "devto-clone",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"next": "11.1.2",
"react": "17.0.2",
"react-dom": "17.0.2"
},
"devDependencies": {
"eslint": "7.32.0",
"eslint-config-next": "11.1.2"
}
}
To solve the "error:0308010C:digital envelope routines::unsupported", set the NODE_OPTIONS environment variable to --openssl-legacy-provider when running your development server, or change your Node. js version to the LTS by issuing the nvm install --lts command.
The OpenSSL legacy provider supplies OpenSSL implementations of algorithms that have been deemed legacy. Such algorithms have commonly fallen out of use, have been deemed insecure by the cryptography community, or something similar. We can consider this the retirement home of cryptographic algorithms.
I found this solution https://github.com/webpack/webpack/issues/14532
if using bash just run NODE_OPTIONS=--openssl-legacy-provider
before any command
adding NODE_OPTIONS=--openssl-legacy-provider
to package.json
"scripts": {
"start": "SET NODE_OPTIONS=--openssl-legacy-provider && react-scripts start",
"build": "SET NODE_OPTIONS=--openssl-legacy-provider && react-scripts build"
},
Edit
In my case, I'm using Nodejs 17.0.1 version and causing this error.
Firstly I'm using this command export NODE_OPTIONS=--openssl-legacy-provider
before any command in GitBash Windows to fix this issue.
But, I think it's not an efficient way, so what I do is :
I just got this error, it seems that you are using Node version 17+. It is not compatible with some webpack stuff yet.
Try using LTS version instead, currently at 16.13.0.
For MacOS and react-native:
"scripts": {
"start": "NODE_OPTIONS=--openssl-legacy-provider react-native start",
}
This occurred with a build in a docker image when it was using latest node version 17.4.0.
I was able to fix it by switching it to Node v.14 image.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With