storybook: [Bug]: Impossible to start storybook (opensslErrorStack)

Describe the bug

New to storybook, tried installing storybook on my react/typescript project using tsdx

Ran tsdx in one terminal : No issue opened a new terminal in the same folder -> run yarn storybook (as in README.md)

got this error

yarn run v1.22.19
$ start-storybook -p 6006
info @storybook/react v6.5.15
info
info => Loading presets
info Addon-docs: using MDX1
info => Using implicit CSS loaders
info => Using prebuilt manager
(node:3171) 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
Starting type checking service...
10% building 1/7 modules 6 active ...enerated-config-entry.jsnode:internal/crypto/hash:71
  this[kHandle] = new _Hash(algorithm, xofLen);
                  ^

Error: error:0308010C:digital envelope routines::unsupported  
    at new Hash (node:internal/crypto/hash:71:19)
    at Object.createHash (node:crypto:140:10)
    at module.exports (/mnt/c/<folder>/node_modules/webpack/lib/util/createHash.js:135:53)
    at NormalModule._initBuildHash (/mnt/c/<folder>/node_modules/webpack/lib/NormalModule.js:417:16)
    at handleParseError (/mnt/c/<folder>/node_modules/webpack/lib/NormalModule.js:471:10)
    at /mnt/c/<folder>/node_modules/webpack/lib/NormalModule.js:503:5
    at /mnt/c/<folder>/node_modules/webpack/lib/NormalModule.js:358:12
    at /mnt/c/<folder>/node_modules/loader-runner/lib/LoaderRunner.js:373:3       
    at iterateNormalLoaders (/mnt/c/<folder>/node_modules/loader-runner/lib/LoaderRunner.js:214:10)
    at /mnt/c/<folder>/node_modules/loader-runner/lib/LoaderRunner.js:205:4 {     
  opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
  library: 'digital envelope routines',
  reason: 'unsupported',
  code: 'ERR_OSSL_EVP_UNSUPPORTED'
}

Node.js v19.3.0
error Command failed with exit code 1.

I have absolutely no idea why this occur and how I might solve it

To Reproduce

> npx tsdx create storybooklibrary
> template react-with-storybook
in one terminal
> cd storybooklibrary
> npm start
open other terminal
> cd storybooklibrary
> npm run storybook

System

No response

Additional context

No response

About this issue

Original URL
State: closed
Created a year ago
Reactions: 4
Comments: 16 (4 by maintainers)

Commits related to this issue

[ci] Fix storybooks (#149077) There's a [known issue](https://github.com/storybookjs/storybook/issues/20482) with storybooks 6 and node 18+ requiring use of the legacy openssl provider. This adds ... — committed to elastic/kibana by jbudz a year ago
Migrate to storybook beta * https://github.com/storybookjs/storybook/issues/20482 — committed to maeek/neutrino-design by maeek a year ago

Most upvoted comments

First, upgrade Storybook and all of its plugins to the latest version. Then, use cross-env to apply the workaround for any operating system.

  "scripts": {
    "storybook": "cross-env NODE_OPTIONS=--openssl-legacy-provider start-storybook -p 6006",
    "build-storybook": "cross-env NODE_OPTIONS=--openssl-legacy-provider build-storybook"
  }

npm i --save-dev cross-env

aminya on Feb 6, 2023

i found a temporary solution: add --openssl-legacy-provider to node option. I using windows and changing the “storybook” script in package.json to SET NODE_OPTIONS=--openssl-legacy-provider && start-storybook -p 6006 solved the problem. iirc you can just remove the SET and it will works for mac and linux (NODE_OPTIONS=--openssl-legacy-provider && start-storybook -p 6006)

pastelite on Jan 4, 2023

If you’re running nvm you can downgrade node to 16.

Soviut on Feb 3, 2023