storybook: Dev server breaks with Node 18.0.0 + node-ip 1.1.5

Describe the bug When updating to Node 18.0.0 start-storybook breaks with

TypeError: details.family.toLowerCase is not a function

	at .../node_modules/ip/lib/ip.js:385:39
	at .../node_modules/ip/lib/ip.js:384:37
	at .../node_modules/ip/lib/ip.js:379:37
	at .../node_modules/@storybook/core-server/dist/cjs/utils/server-address.js:20:55

To Reproduce Launch a start-storybook with Node 18.0.0 and node-ip@1.1.5.

System

System: OS: Windows 10 10.0.19044 CPU: (24) x64 12th Gen Intel® Core™ i9-12900KF Binaries: Node: 16.14.2 - C:\Program Files\nodejs\node.EXE npm: 8.6.0 - C:\Program Files\nodejs\npm.CMD Browsers: Edge: Spartan (44.19041.1266.0), Chromium (100.0.1185.44) npmPackages: @storybook/addon-a11y: ^6.4.22 => 6.4.22 @storybook/addon-docs: ^6.4.18 => 6.4.22 @storybook/addon-essentials: ^6.4.22 => 6.4.22 @storybook/addons: ^6.4.18 => 6.4.22 @storybook/builder-webpack5: ^6.4.18 => 6.4.22 @storybook/manager-webpack5: ^6.4.18 => 6.4.22 @storybook/theming: ^6.4.18 => 6.4.22 @storybook/vue3: ^6.4.18 => 6.4.22

Additional context This is caused by the following Node 18 introduced Undocumented change to “family” attribute in os.networkInterfaces() in Node 18. Issue on node-ip along with a PR has been submitted.

About this issue

Original URL
State: closed
Created 2 years ago
Reactions: 23
Comments: 16 (4 by maintainers)

Commits related to this issue

SX Design: patch 3rd party dependency See: https://github.com/storybookjs/storybook/issues/18019 Should we resolved in `ip` version 1.1.6 or 2.0.0, see: https://github.com/indutny/node-ip/commit/4de... — committed to adeira/universe by mrtnzlml 2 years ago
SX Design: patch 3rd party dependency See: https://github.com/storybookjs/storybook/issues/18019 Should we resolved in `ip` version 1.1.6 or 2.0.0, see: https://github.com/indutny/node-ip/commit/4de... — committed to adeira/universe by mrtnzlml 2 years ago
SX Design: patch 3rd party dependency See: https://github.com/storybookjs/storybook/issues/18019 Should we resolved in `ip` version 1.1.6 or 2.0.0, see: https://github.com/indutny/node-ip/commit/4de... — committed to adeira/sx-design by mrtnzlml 2 years ago
update storybook packjson specify host --host 0.0.0.0 https://github.com/storybookjs/storybook/issues/18019 — committed to 2p4b/octal-clients by 2p4b 2 years ago

Most upvoted comments

Found a workaround.

The error only comes if Storybook attempts to figure out the current network address If the host option is set then the problem is avoided.

So passing -h localhost to start-storybook bypasses the problem.

+23

riovir on Apr 22, 2022

Found a workaround.

The error only comes if Storybook attempts to figure out the current network address If the host option is set then the problem is avoided.

So passing -h localhost to start-storybook bypasses the problem.

Thank you so much! That solved it for me.

kaelanbelaga on May 2, 2022

I’m facing the same issue. Specifying --host localhost option caused a different error on my env.

My environment

macOS 12.3.1

npm: '8.8.0',
  node: '18.1.0',
  v8: '10.1.124.8-node.13',
  uv: '1.43.0',
  zlib: '1.2.11',
  brotli: '1.0.9',
  ares: '1.18.1',
  modules: '108',
  nghttp2: '1.47.0',
  napi: '8',
  llhttp: '6.0.4',
  openssl: '3.0.2+quic',
  cldr: '41.0',
  icu: '71.1',
  tz: '2022a',
  unicode: '14.0',
  ngtcp2: '0.1.0-DEV',
  nghttp3: '0.1.0-DEV'

"@storybook/addon-actions": "^6.4.22",
"@storybook/addon-docs": "^6.4.22",
"@storybook/addon-essentials": "^6.4.22",
"@storybook/addon-interactions": "^6.4.22",
"@storybook/addon-links": "^6.4.22",
"@storybook/addon-postcss": "^2.0.0",
"@storybook/builder-vite": "^0.1.32",
"@storybook/react": "^6.4.22"

.storybook/main.js

module.exports = {
    stories: ['../src/**/*.stories.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'],
    addons: [
        '@storybook/addon-links',
        '@storybook/addon-essentials',
        '@storybook/addon-interactions',
    ],
    framework: '@storybook/react',
    core: {
        builder: '@storybook/builder-vite',
    },
};

Runned command

start-storybook -p 6006 --host localhost

Result

node:internal/crypto/hash:67
  this[kHandle] = new _Hash(algorithm, xofLen);
                  ^

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

arayaryoma on May 10, 2022

I’m running Storybook in Docker. The localhost workaround doesn’t work for me. I can’t connect to the server from my browser, even if the original error is muted. After digging around in the code, I could tell that --host is used for a few things. Apart for displaying a welcome message and opening Storybook in the browser, it’s also passed to Express’s listen().

With the information above, I got it to work with the unspecific IPv4 address 0.0.0.0, i.e. by passing --host 0.0.0.0 to start-storybook.

sjoqvist on May 4, 2022

As a workaround, what helped me to make storybook work with node 18, is install these addons and webpack

 "@storybook/builder-webpack5": "^6.4.22",
 "@storybook/manager-webpack5": "^6.4.22",
  "webpack": "^5.0.0"

main.js

module.exports = {
  core: {
    builder: 'webpack5',
  },
}

rpehlivan1 on May 13, 2022

Meanwhile, node-ip@1.1.6 and node-ip2.0.0 have been released already including the fix. Fixing this issue should be a version bump now. (Fingers crossed.)

riovir on May 10, 2022

export NODE_OPTIONS=–openssl-legacy-provider

solved the issue for me

https://stackoverflow.com/questions/69692842/error-message-error0308010cdigital-envelope-routinesunsupported

fatikh1808 on Sep 19, 2023

Edit: actually my issue is tracked at https://github.com/storybookjs/storybook/issues/16555

I seem to have this issue with following dependencies:

    "@babel/core": "^7.19.3",
    "@rollup/plugin-commonjs": "^22.0.2",
    "@rollup/plugin-node-resolve": "^14.1.0",
    "@storybook/addon-a11y": "^6.5.12",
    "@storybook/addon-actions": "^6.5.12",
    "@storybook/addon-essentials": "^6.5.12",
    "@storybook/addon-interactions": "^6.5.12",
    "@storybook/addon-links": "^6.5.12",
    "@storybook/builder-webpack4": "^6.5.12",
    "@storybook/manager-webpack4": "^6.5.12",
    "@storybook/test-runner": "^0.7.2",
    "@storybook/testing-library": "^0.0.13",
    "@storybook/web-components": "^6.5.12",
    "autoprefixer": "^10.4.12",
    "babel-loader": "^8.2.5",
    "eslint": "^8.24.0",
    "eslint-plugin-lit": "^1.6.1",
    "lit-html": "^2.3.1"

I can’t run sb upgrade yet (we use 2 separate package.json to isolate the dependencies of Storybook from the code), is there something else to do to avoid this issue?

“ip” is on 1.1.8 as expected

I am on 6.5.12 and it seemed to have been fixed in 6.5.6 already.

I am using Node 18.12.0.

The error message is specifically the one from @arayaryoma above, related to “crypto”: https://github.com/storybookjs/storybook/issues/18019#issuecomment-1121953310

eric-burel on Nov 8, 2022

Good golly!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.5.6 containing PR #18330 that references this issue. Upgrade today to the @latest NPM tag to try it out!

npx sb upgrade

shilman on May 30, 2022

Great Caesar’s ghost!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.5.6-alpha.0 containing PR #18330 that references this issue. Upgrade today to the @prerelease NPM tag to try it out!

npx sb upgrade --prerelease

Closing this issue. Please re-open if you think there’s still more to do.

shilman on May 27, 2022

any news on this?

@bonesoul This is fixed in node-ip@1.1.6, so it should be enough to upgrade your dependencies. I chose to enforce a package resolution using Yarn and leave all other packages as they were. YMMV.

sjoqvist on May 11, 2022

@arayaryoma Please see https://github.com/storybookjs/storybook/issues/16555 for this issue.

bodograumann on May 10, 2022