create-react-app icon indicating copy to clipboard operation
create-react-app copied to clipboard

react-scripts fails to build project with Node 17

Open aghArdeshir opened this issue 4 years ago • 32 comments

Describe the bug

we have a CRA app, it used to build with Node 14.x very fine, today I upgrade nodejs to 17.0.0 and it failed. (in both my local machine and the CI-CD machine)

And these were the logs:

> react-scripts build
Creating an optimized production build...
Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:67:19)
    at Object.createHash (node:crypto:130:10)
    at module.exports (/my-project/node_modules/webpack/lib/util/createHash.js:135:53)
    at NormalModule._initBuildHash (/my-project/node_modules/webpack/lib/NormalModule.js:417:16)
    at handleParseError (/my-project/node_modules/webpack/lib/NormalModule.js:471:10)
    at /my-project/node_modules/webpack/lib/NormalModule.js:503:5
    at /my-project/node_modules/webpack/lib/NormalModule.js:358:12
    at /my-project/node_modules/loader-runner/lib/LoaderRunner.js:373:3
    at iterateNormalLoaders (/my-project/node_modules/loader-runner/lib/LoaderRunner.js:214:10)
    at iterateNormalLoaders (/my-project/node_modules/loader-runner/lib/LoaderRunner.js:221:10)
    at /my-project/node_modules/loader-runner/lib/LoaderRunner.js:236:3
    at runSyncOrAsync (/my-project/node_modules/loader-runner/lib/LoaderRunner.js:130:11)
    at iterateNormalLoaders (/my-project/node_modules/loader-runner/lib/LoaderRunner.js:232:2)
    at Array.<anonymous> (/my-project/node_modules/loader-runner/lib/LoaderRunner.js:205:4)
    at Storage.finished (/my-project/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:55:16)
    at /my-project/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:91:9
/my-project/node_modules/react-scripts/scripts/build.js:19
  throw err;
  ^
Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:67:19)
    at Object.createHash (node:crypto:130:10)
    at module.exports (/my-project/node_modules/webpack/lib/util/createHash.js:135:53)
    at NormalModule._initBuildHash (/my-project/node_modules/webpack/lib/NormalModule.js:417:16)
    at /my-project/node_modules/webpack/lib/NormalModule.js:452:10
    at /my-project/node_modules/webpack/lib/NormalModule.js:323:13
    at /my-project/node_modules/loader-runner/lib/LoaderRunner.js:367:11
    at /my-project/node_modules/loader-runner/lib/LoaderRunner.js:233:18
    at context.callback (/my-project/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
    at /my-project/node_modules/babel-loader/lib/index.js:59:103 {
  opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
  library: 'digital envelope routines',
  reason: 'unsupported',
  code: 'ERR_OSSL_EVP_UNSUPPORTED'
}
Node.js v17.0.0
ERROR: Job failed: exit status 1

Did you try recovering your dependencies?

yes. in both local machine and CI-CD machine I re-installed all the dependencies

Which terms did you search for in User Guide?

I searched Google for error:0308010C:digital envelope routines::unsupported with and without the 0308010C part

Environment

current version of create-react-app: 4.0.3
  running from /home/.npm/_npx/34113/lib/node_modules/create-react-app

  System:
    OS: Linux 5.13 Ubuntu 21.10 21.10 (Impish Indri)
    CPU: (4) x64 Intel(R) Core(TM) i5-4460  CPU @ 3.20GHz
  Binaries:
    Node: 17.0.0 - /usr/bin/node
    Yarn: Not Found
    npm: 8.1.0 - /usr/bin/npm
  Browsers:
    Chrome: 95.0.4638.54
    Firefox: 93.0
  npmPackages:
    react: ^16.13.1 => 16.13.1 
    react-dom: ^16.13.1 => 16.13.1 
    react-scripts: ^4.0.3 => 4.0.3 
  npmGlobalPackages:
    create-react-app: Not Found

Steps to reproduce

(Write your steps here:)

  1. create new react app with create-react-app and node 14
  2. do npm run build to see it builds completely fine
  3. upgrade to node 17 and do npm run build again to see it fail

Expected behavior

to build flawlessly

Actual behavior

The build failed with errors printed above!

Note

I know that it is mostly not related to create-react-app, but another package, maybe webpack or it's dependencies. But as I cannot dig down, I write this issue here so the professionals can track it further.

Thanks

aghArdeshir avatar Oct 20 '21 08:10 aghArdeshir

This looks like a relevant discussion related to this issue: https://stackoverflow.com/questions/69394632/webpack-build-failing-with-err-ossl-evp-unsupported

Gnito avatar Oct 20 '21 14:10 Gnito

Having the same issue. Node 16.11.1 works but 17.0.0 and 17.0.1 are causing this error.

niels-bosman avatar Oct 20 '21 20:10 niels-bosman

Yes @Gnito that's it I think. So it is probably either Webpack's to update something, or react-scripts' to change some config, right?

aghArdeshir avatar Oct 20 '21 22:10 aghArdeshir

in your package.json: change this line "build": "react-scripts start", to "build": "react-scripts --openssl-legacy-provider build",

trashcoder avatar Oct 22 '21 06:10 trashcoder

in your package.json: change this line "build": "react-scripts start", to "build": "react-scripts --openssl-legacy-provider build",

Doing this results in a bad option: --openssl-legacy-provider error in Node 16. So this isn't a workaround projects can actually use in their scripts unless they have absolute control over the version of Node everyone uses and can prohibit use of LTS versions by anyone.

The only real fix will likely be the release of CRA v5.

dantman avatar Oct 25 '21 22:10 dantman

The only real fix will likely be the release of CRA v5.

Actually it seems that this won't necessarily fix the issue alone. WebPack does plan to change the default hash function in WebPack 6 but cannot change it in 4 or 5.

CRA needs to change the hashFunction and make a release. Though given CRA v4 hasn't received an update since Feb and CRA has other issues with Node 17 (#11565) I presume we'll only get that fix in CRA v5,

dantman avatar Oct 26 '21 01:10 dantman

Could be fixed by #11597

niels-bosman avatar Nov 01 '21 14:11 niels-bosman

Merged #11597 just before, and currently testing on local computer.

HADMARINE avatar Nov 01 '21 22:11 HADMARINE

I tested out the @next version of CRA v5. It seems there may be some more work required in order to make Node 17 work.

I'm still getting this error but now it's due to CRA v5 still using file-loader. The implication in the WebPack thread on Node 17 is that file-loader is obsolete and the fix to file-loader breaking Node 17 is to not use file-loader because it's no longer supported.

We may need #11213 before CRA v5 will work on Node 17.

dantman avatar Nov 08 '21 23:11 dantman

On MBP w/M1, running Node v17, to run React with npm start I had to change my start script to "start": "react-scripts --openssl-legacy-provider start". But when I try to run npm run deploy, it reads "/opt/homebrew/Cellar/nvm/0.38.0/versions/node/v16.13.0/bin/node: bad option: --openssl-legacy-provider"

I tried "react-scripts --openssl-legacy-provider build" and it does not work. Switched to Node v16.13.0 and it works as it came upon initialization.

"start": "react-scripts --openssl-legacy-provider start", "build": "react-scripts build",

Pretty annoying, but hey, I've heard things change all the change in this industry and a few months from now, someone will see this comment and things will be different then as well.

cburk2019 avatar Dec 02 '21 17:12 cburk2019

If you need to support both 17 and older NodeJS versions you can use if-node-version to execute different commands for different NodeJS versions:

{
    "scripts": {
        "build": "if-node-version '>= 17' && react-scripts --openssl-legacy-provider build || react-scripts build",
    }
}

KiraLT avatar Dec 21 '21 09:12 KiraLT

Looks like this has been fixed.

sorenhoyer avatar Jun 22 '22 23:06 sorenhoyer

It work Thanks.

"scripts": { "start": "react-scripts --openssl-legacy-provider start", "build": "react-scripts --openssl-legacy-provider build", "test": "react-scripts test", "eject": "react-scripts eject" },

patbi avatar Oct 30 '22 16:10 patbi

why not to pass to webpack config to use some modern hash function instead of deprecated md4 https://webpack.js.org/configuration/output/#outputhashfunction ?

linux019 avatar Nov 08 '22 09:11 linux019

CRA is now a tech debt.

aprilmintacpineda avatar Feb 20 '23 07:02 aprilmintacpineda

It work Thanks.

"scripts": { "start": "react-scripts --openssl-legacy-provider start", "build": "react-scripts --openssl-legacy-provider build", "test": "react-scripts test", "eject": "react-scripts eject" },

Thanks Pat! That worked for me also.

Mussassa avatar Feb 22 '23 07:02 Mussassa

11562

MohibullahHABIBZAI avatar Feb 24 '23 18:02 MohibullahHABIBZAI

for react-app-rewired use it like this "start": "react-app-rewired --openssl-legacy-provider start ",

eladonline avatar Jul 17 '23 09:07 eladonline

Hell

Palinan1985 avatar Sep 13 '23 18:09 Palinan1985

I had the same issue with Node v18.13.0
Fix step:
install nvm upgrade node version to 20.3.0 via cmd nvm install v20.0.3 do npm -v must be 9.6.7

Test again npm run build

guychou7 avatar Oct 27 '23 01:10 guychou7

Kinding58 Wallet has been created successfully

Paulk58 avatar Nov 05 '23 04:11 Paulk58

Kinding58 Wallet shall be used for various pi transactions

Paulk58 avatar Nov 05 '23 04:11 Paulk58

It's done

Paulk58 avatar Nov 05 '23 04:11 Paulk58

This is Paulk58 Netface Wallet created on 10th November 2023

Paulk58 avatar Nov 10 '23 11:11 Paulk58

This is Paulk58 Whatsapp wallet re-created on 10 th November 2023

Paulk58 avatar Nov 10 '23 13:11 Paulk58

This is Paulk58 Whatsapp wallet re-created on 10 November 2023

Paulk58 avatar Nov 10 '23 13:11 Paulk58

Describe the bug

we have a CRA app, it used to build with Node 14.x very fine, today I upgrade nodejs to 17.0.0 and it failed. (in both my local machine and the CI-CD machine)

And these were the logs:


> react-scripts build

Creating an optimized production build...

Error: error:0308010C:digital envelope routines::unsupported

    at new Hash (node:internal/crypto/hash:67:19)

    at Object.createHash (node:crypto:130:10)

    at module.exports (/my-project/node_modules/webpack/lib/util/createHash.js:135:53)

    at NormalModule._initBuildHash (/my-project/node_modules/webpack/lib/NormalModule.js:417:16)

    at handleParseError (/my-project/node_modules/webpack/lib/NormalModule.js:471:10)

    at /my-project/node_modules/webpack/lib/NormalModule.js:503:5

    at /my-project/node_modules/webpack/lib/NormalModule.js:358:12

    at /my-project/node_modules/loader-runner/lib/LoaderRunner.js:373:3

    at iterateNormalLoaders (/my-project/node_modules/loader-runner/lib/LoaderRunner.js:214:10)

    at iterateNormalLoaders (/my-project/node_modules/loader-runner/lib/LoaderRunner.js:221:10)

    at /my-project/node_modules/loader-runner/lib/LoaderRunner.js:236:3

    at runSyncOrAsync (/my-project/node_modules/loader-runner/lib/LoaderRunner.js:130:11)

    at iterateNormalLoaders (/my-project/node_modules/loader-runner/lib/LoaderRunner.js:232:2)

    at Array.<anonymous> (/my-project/node_modules/loader-runner/lib/LoaderRunner.js:205:4)

    at Storage.finished (/my-project/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:55:16)

    at /my-project/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:91:9

/my-project/node_modules/react-scripts/scripts/build.js:19

  throw err;

  ^

Error: error:0308010C:digital envelope routines::unsupported

    at new Hash (node:internal/crypto/hash:67:19)

    at Object.createHash (node:crypto:130:10)

    at module.exports (/my-project/node_modules/webpack/lib/util/createHash.js:135:53)

    at NormalModule._initBuildHash (/my-project/node_modules/webpack/lib/NormalModule.js:417:16)

    at /my-project/node_modules/webpack/lib/NormalModule.js:452:10

    at /my-project/node_modules/webpack/lib/NormalModule.js:323:13

    at /my-project/node_modules/loader-runner/lib/LoaderRunner.js:367:11

    at /my-project/node_modules/loader-runner/lib/LoaderRunner.js:233:18

    at context.callback (/my-project/node_modules/loader-runner/lib/LoaderRunner.js:111:13)

    at /my-project/node_modules/babel-loader/lib/index.js:59:103 {

  opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],

  library: 'digital envelope routines',

  reason: 'unsupported',

  code: 'ERR_OSSL_EVP_UNSUPPORTED'

}

Node.js v17.0.0

ERROR: Job failed: exit status 1

Did you try recovering your dependencies?

yes. in both local machine and CI-CD machine I re-installed all the dependencies

Which terms did you search for in User Guide?

I searched Google for error:0308010C:digital envelope routines::unsupported with and without the 0308010C part

Environment


current version of create-react-app: 4.0.3

  running from /home/.npm/_npx/34113/lib/node_modules/create-react-app



  System:

    OS: Linux 5.13 Ubuntu 21.10 21.10 (Impish Indri)

    CPU: (4) x64 Intel(R) Core(TM) i5-4460  CPU @ 3.20GHz

  Binaries:

    Node: 17.0.0 - /usr/bin/node

    Yarn: Not Found

    npm: 8.1.0 - /usr/bin/npm

  Browsers:

    Chrome: 95.0.4638.54

    Firefox: 93.0

  npmPackages:

    react: ^16.13.1 => 16.13.1 

    react-dom: ^16.13.1 => 16.13.1 

    react-scripts: ^4.0.3 => 4.0.3 

  npmGlobalPackages:

    create-react-app: Not Found

Steps to reproduce

(Write your steps here:)

  1. create new react app with create-react-app and node 14

  2. do npm run build to see it builds completely fine

  3. upgrade to node 17 and do npm run build again to see it fail

Expected behavior

to build flawlessly

Actual behavior

The build failed with errors printed above!

Note

I know that it is mostly not related to create-react-app, but another package, maybe webpack or it's dependencies. But as I cannot dig down, I write this issue here so the professionals can track it further.

Thanks

Roberthimmotta avatar Jan 11 '24 15:01 Roberthimmotta

SBWJC2MWIZ3UX66U4R6EEXEBBCZLAJVOWZNGUMM3V4MPMJUGNTZ3FO5C

Hungtery85 avatar Aug 12 '24 10:08 Hungtery85

SBWJC2MWIZ3UX66U4R6EEXEBBCZLAJVOWZNGUMM3V4MPMJUGNTZ3FO5C

Hungtery85 avatar Aug 12 '24 10:08 Hungtery85

GDFXR3RGDSEVFRQ44T5B5LXJOPBEE7B6POZN3SMWY7XJIX753JLMEWI2

Hungtery85 avatar Aug 12 '24 10:08 Hungtery85