running npm start keeps showing errors

Question

Every time i try running npm start on my windows powershell for my react project it keeps showing me errors

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 (C:\Users\user\Documents\Fashola\Web-Development\app-project\node_modules\webpack\lib\util\createHash.js:135:53)
    at NormalModule._initBuildHash (C:\Users\user\Documents\Fashola\Web-Development\app-project\node_modules\webpack\lib\NormalModule.js:417:16)
    at handleParseError (C:\Users\user\Documents\Fashola\Web-Development\app-project\node_modules\webpack\lib\NormalModule.js:471:10)
    at C:\Users\user\Documents\Fashola\Web-Development\app-project\node_modules\webpack\lib\NormalModule.js:503:5
    at C:\Users\user\Documents\Fashola\Web-Development\app-project\node_modules\webpack\lib\NormalModule.js:358:12
    at C:\Users\user\Documents\Fashola\Web-Development\app-project\node_modules\loader-runner\lib\LoaderRunner.js:373:3
    at iterateNormalLoaders (C:\Users\user\Documents\Fashola\Web-Development\app-project\node_modules\loader-runner\lib\LoaderRunner.js:214:10)
    at iterateNormalLoaders (C:\Users\user\Documents\Fashola\Web-Development\app-project\node_modules\loader-runner\lib\LoaderRunner.js:221:10)
C:\Users\user\Documents\Fashola\Web-Development\app-project\node_modules\react-scripts\scripts\start.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 (C:\Users\user\Documents\Fashola\Web-Development\app-project\node_modules\webpack\lib\util\createHash.js:135:53)
    at NormalModule._initBuildHash (C:\Users\user\Documents\Fashola\Web-Development\app-project\node_modules\webpack\lib\NormalModule.js:417:16)
    at C:\Users\user\Documents\Fashola\Web-Development\app-project\node_modules\webpack\lib\NormalModule.js:452:10
    at C:\Users\user\Documents\Fashola\Web-Development\app-project\node_modules\webpack\lib\NormalModule.js:323:13
    at C:\Users\user\Documents\Fashola\Web-Development\app-project\node_modules\loader-runner\lib\LoaderRunner.js:367:11
    at C:\Users\user\Documents\Fashola\Web-Development\app-project\node_modules\loader-runner\lib\LoaderRunner.js:233:18
    at context.callback (C:\Users\user\Documents\Fashola\Web-Development\app-project\node_modules\loader-runner\lib\LoaderRunner.js:111:13)
    at C:\Users\user\Documents\Fashola\Web-Development\app-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'

And also what does that reason: 'unsupported' mean?

Answer 1

If you're using Webpack (which it appears OP is using from their stack trace) and Node 17, there have been some compatibility issues. Node 17 changed from OpenSSL 1.1 to 3.0, and there were some breaking changes causing a bug in Webpack. There appear to a couple of solutions to this problem.

Option 1: Update Webpack.

Version 5.61.0 fixes this bug. This is the easiest solution.

If you're on Webpack 4, the developers have no intention to create a bugfix for this version. You will have to either update to version 5 or use option 3/4 below.

Option 2: Update webpack.config.js .

For webpack>=5.54 , you can manually change the hashing algorithm to one that works with OpenSSL 3.0.

module.exports = {
    output: {
        hashFunction: 'xxhash64'
    }
}

Option 3: Downgrade Node.

Changing to an LTS version of Node (currently 16.x) should resolve the problem for now. However, this doesn't solve the problem, it only delays the problem.

Option 4: Change NODE_OPTIONS

For any version of Webpack with Node 17, you can set a flag to revert to the old OpenSSL API. This isn't ideal, but it works.

# Works in *nix shells
NODE_OPTIONS='--openssl-legacy-provider' npm start

# ============================
# or (cross-platform solution)
# ============================

# requires installing `cross-env`
npm install -D cross-env

# then...
cross-env NODE_OPTIONS='--openssl-legacy-provider' npm start