28

I was building a simple React app using Tailwind. I used create-react-app and then installed tailwind. I have done this many times before.

In order to install Tailwind, I also had to install craco and change package.json "scripts" to use craco, like so:

"scripts": {
    "start": "craco start",
    "build": "craco build",
    "test": "craco test",
    "eject": "react-scripts eject"
  }

However, this time, when I ran npm start, I got an error that I had never encountered before:

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

So I searched on StackOverflow and someone suggested adding --openssl-legacy-provider to my "start" script like this:

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

And it's working now. But can somebody please explain to me what --openssl-legacy-provider actually is and how it works?

4

5 Answers 5

5

Due to changes on Node.js v17, --openssl-legacy-provider was added for handling key size on OpenSSL v3. You somehow have installed the latest version of node.

  1. Restore your previous version of nodejs.
  2. Go and manually remove the node dependency(e.g. "node":17.4.3) from package.json and packagelock.json.
  3. Delete node_modules folder and use npm install to reinstall node_modules.
2
  • 4
    is there a way to keep node v17+ and still run it? Aug 15, 2022 at 15:33
  • 25
    Oh no! yet another "downgrade-to-solve-everything" answer... As a Java developer I LOVE Node.JS ... reminds me Java back to 90's. Dependency nightmare. Solution: keep yourself 10 versions behind.
    – Magno C
    Oct 7, 2022 at 1:49
4

I have seen many answers regarding the OpenSSL issue that people encounter due to the changes on Node.js v17. Personally, I encountered the problem in a vue.js/electron application after switching to my new MacBook with M1 chip.
This GitHub issue lists multiple options that worked for different users. In my scenario, adjusting the script commands in the package.json file worked:

"serve": "export NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve",

"build": "export NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service build"

I've seen user replacing th export with a run command. Keep in mind that the syntax might differ on another Os. For example:

Set and set

The full issue with all possible answers.

1

I have found a solution in this GitHub issue and it works for my case.

For Node.js v17+, you need to put the openssl-legacy-provider flag after your command, for example:

  • From npm --openssl-legacy-provider start to npm start --openssl-legacy-provider start
  • From npm --openssl-legacy-provider build to npm start --openssl-legacy-provider build

... and so on.

1
  • 2
    @ThomasSablik Sorry for the inconvenience, this is the first time I post an answer here. Thanks for your advice! I have edited my answer. Oct 7, 2022 at 10:44
1

Adding --openssl-legacy-provider in package.json sure works, but if you don't want to use the legacy SSL provider, you can upgrade your webpack- and react-scripts versions.

I had to first delete package_lock.json and node_modules/. Then I ran:

npm install --save-dev webpack@5.74.0 --legacy-peer-deps
npm install --save-dev react-scripts@5.0.1 --legacy-peer-deps
npm install --legacy-peer-deps

After this, I tested with:

npm start

I also had to fix a few other issues, but eventually got it working.

2
  • I'm assuming these other issues were issues relating to polyfills. Would you happen to recall how you solved those and if there was an issue displaying images after doing so? Jan 18 at 3:58
  • Hi, @BasiliskHill. I'm sorry, but my issues were not related to polyfills. I had to modify some files in the Semantic UI npm package.
    – robino16
    Jan 19 at 9:39
1

I had this error in Nuxt 2.15 I fixed the error in the following way.

package.json edit

I had Ubuntu so this method worked for me

"scripts":{
    "dev":"export SET NODE_OPTIONS=--openssl-legacy-provider && nuxt",
    "build":"export SET NODE_OPTIONS=--openssl-legacy-provider && nuxt build",
    "start":"export SET NODE_OPTIONS=--openssl-legacy-provider && nuxt start",
    "generate":"export SET NODE_OPTIONS=--openssl-legacy-provider && nuxt generate"
  },

My partner had Windows but the above method didn't work on it, then this method worked

"scripts":{
    "dev":"SET NODE_OPTIONS=--openssl-legacy-provider && nuxt",
    "build":"SET NODE_OPTIONS=--openssl-legacy-provider && nuxt build",
    "start":"SET NODE_OPTIONS=--openssl-legacy-provider && nuxt start",
    "generate":"SET NODE_OPTIONS=--openssl-legacy-provider && nuxt generate"
  },

The most interesting thing was that it worked in other ways in Ubuntu and Windows

1
  • 3
    export SET NODE_OPTIONS=--openssl-legacy-provider sets two different environment variables, SET and NODE_OPTIONS. These snippets look like cargo cult programming. Don't do this. Jan 13 at 12:20

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.