Fix Storybook OpenSSL Error on Node.js v17+ by Using Legacy Provider

[Adagedo]

Summary & motivation

Storybook was failing to run on Node.js v17+ due to OpenSSL breaking changes and Webpack's use of deprecated crypto functions. Added the --openssl-legacy-provider flag to the NODE_OPTIONS in the storybook script in package.json. This ensures compatibility with newer Node.js versions without requiring a downgrade.

Testing & documentation

Before making changes

yarn run v1.22.22
$ start-storybook -p 6006 
info @storybook/react v6.5.0-beta.8
info 
info => Loading presets
info => Using implicit CSS loaders
(node:6375) DeprecationWarning: Default PostCSS plugins are deprecated. When switching to '@storybook/addon-postcss',
you will need to add your own plugins, such as 'postcss-flexbugs-fixes' and 'autoprefixer'.

See https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#deprecated-default-postcss-plugins for details.
(Use `node --trace-deprecation ...` to show where the warning was created)
info => Using default Webpack4 setup
10% building 1/4 modules 3 active ...ode_modules/babel-loader/lib/index.js??ref--4-0!/workspaces/react-stripe-js/generated-stories-entry.jsBrowserslist: caniuse-lite is outdated. Please run:
npx browserslist@latest --update-db

Why you should do it regularly:
https://github.com/browserslist/browserslist#browsers-data-updating
node:internal/crypto/hash:79
  this[kHandle] = new _Hash(algorithm, xofLen, algorithmId, getHashCache());
                  ^

Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:79:19)
    at Object.createHash (node:crypto:139:10)
    at module.exports (/workspaces/react-stripe-js/node_modules/webpack/lib/util/createHash.js:135:53)
    at NormalModule._initBuildHash (/workspaces/react-stripe-js/node_modules/webpack/lib/NormalModule.js:417:16)
    at handleParseError (/workspaces/react-stripe-js/node_modules/webpack/lib/NormalModule.js:471:10)
    at /workspaces/react-stripe-js/node_modules/webpack/lib/NormalModule.js:503:5
    at /workspaces/react-stripe-js/node_modules/webpack/lib/NormalModule.js:358:12
    at /workspaces/react-stripe-js/node_modules/loader-runner/lib/LoaderRunner.js:373:3
    at iterateNormalLoaders (/workspaces/react-stripe-js/node_modules/loader-runner/lib/LoaderRunner.js:214:10)
    at Array.<anonymous> (/workspaces/react-stripe-js/node_modules/loader-runner/lib/LoaderRunner.js:205:4)
    at Storage.finished (/workspaces/react-stripe-js/node_modules/webpack/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:55:16)
    at /workspaces/react-stripe-js/node_modules/webpack/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:91:9
    at /workspaces/react-stripe-js/node_modules/graceful-fs/graceful-fs.js:123:16
    at FSReqCallback.readFileAfterClose [as oncomplete] (node:internal/fs/read/context:68:3) {
  opensslErrorStack: [
    'error:03000086:digital envelope routines::initialization error',
    'error:0308010C:digital envelope routines::unsupported'
  ],
  library: 'digital envelope routines',
  reason: 'unsupported',
  code: 'ERR_OSSL_EVP_UNSUPPORTED'
}

Node.js v20.17.0
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

After Making changes...
Storybook runs successfully.

│                                                                                          │
│   Storybook 6.5.0-beta.8 for React started                                               │
│   5.91 s for preview                                                                     │
│                                                                                          │
│    Local:            http://localhost:6006/                                              │
│    On your network:  http://10.0.3.111:6006/                                             │
│                                                                                          │
│   A new version (8.3.0) is available!                                                    │
│                                                                                          │
│   Upgrade now: npx sb@latest upgrade                                                     │
│                                                                                          │
│   Read full changelog: https://github.com/storybookjs/storybook/blob/next/CHANGELOG.md 

[CLAassistant]

All committers have signed the CLA.

[CLAassistant]

Thank you for your submission! We really appreciate it. Like many open source projects, we ask that you sign our Contributor License Agreement before we can accept your contribution.
_{You have signed the CLA already but the status is still pending? Let us recheck it.}

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.