[Bug]: Failed to build the preview Error: listen EADDRNOTAVAIL: address not available 198.18.17.88:6006

[beilo]

版本信息

System:
    OS: macOS 12.5.1
    CPU: (8) x64 Intel(R) Core(TM) i5-8257U CPU @ 1.40GHz
    Memory: 56.91 MB / 16.00 GB
    Shell: 5.8.1 - /bin/zsh
  Browsers:
    Chrome: 125.0.6422.176
    Safari: 15.6.1

问题详情

使用modern module，添加storybook进行使用时端口一直有问题。电脑重启过也不行。
Using the modern module and adding Storybook, there are always issues with the port. Restarting the computer didn't help either.

下面我提供下日志信息

npx @modern-js/create wx-experience
? Please select the type of project you want to create: Npm Module
? Please fill in the project name: wx-experience
? Please select the programming language: TS
? Please select the package manager: pnpm
Found '/Users/Documents/librarys/wx-experience/.nvmrc' with version <lts/hydrogen>
v18.20.3 is already installed.
Now using node v18.20.3 (npm v10.7.0)
 WARN  deprecated [email protected]: Rimraf versions prior to v4 are no longer supported
 WARN  deprecated [email protected]: Glob versions prior to v9 are no longer supported
 WARN  deprecated [email protected]: Glob versions prior to v9 are no longer supported
 WARN  deprecated [email protected]: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
 WARN  deprecated @humanwhocodes/[email protected]: Use @eslint/config-array instead
 WARN  deprecated @humanwhocodes/[email protected]: Use @eslint/object-schema instead
Packages: +726
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Packages are copied from the content-addressable store to the virtual store.
  Content-addressable store is at: /Users/leipeng/Library/pnpm/store/v3
  Virtual store is at:             node_modules/.pnpm
Progress: resolved 789, reused 717, downloaded 9, added 726, done

> [email protected] prepare /Users/Documents/librarys/wx-experience
> modern build && husky install

  Modern.js Module v2.53.0

info    Build succeed in 1.3s
info    Bundle generated 3 files

Bundle Files           Size
dist/types/index.d.ts  82.0 B
dist/es/index.js       104.0 B
dist/lib/index.js      990.0 B
husky - Git hooks installed

devDependencies:
+ @modern-js/eslint-config 2.53.0
+ @modern-js/module-tools 2.53.0
+ @types/node 16.11.7 (20.14.2 is available)
+ husky 8.0.1 (9.0.11 is available)
+ lint-staged 13.1.0 (15.2.5 is available)
+ prettier 2.8.1 (3.3.2 is available)
+ rimraf 3.0.2 (5.0.7 is available) deprecated
+ typescript 5.0.4 (5.4.5 is available)

Done in 53.4s
[INFO] dependencies are automatically installed
[INFO] git repository has been automatically created
[INFO] Success！
pnpm run dev          # Run and debug the project
pnpm run build        # Build the module for production
pnpm run lint         # Run ESLint and automatically fix problems
pnpm run change       # Add a new changeset
pnpm run bump         # Update version and changelog via changeset
pnpm run new          # Enable optional features
pnpm run test         # Run test cases
pnpm run release      # Release the package
[INFO] you can execute 'cd wx-experience' to entry the project directory
❯ cd wx-experience
Found '/Users/Documents/librarys/wx-experience/.nvmrc' with version <lts/hydrogen>
Now using node v18.20.3 (npm v10.7.0)



pnpm new

> [email protected] new /Users/Documents/librarys/wx-experience
> modern new

  Modern.js Module v2.53.0

? Please select the operation you want: Enable Features
? Please select the feature name: Enable Storybook V7

 WARN  deprecated [email protected]: Rimraf versions prior to v4 are no longer supported
 WARN  deprecated [email protected]: Glob versions prior to v9 are no longer supported
 WARN  deprecated [email protected]: Glob versions prior to v9 are no longer supported
 WARN  deprecated [email protected]: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
 WARN  deprecated [email protected]: This package is no longer supported.
 WARN  deprecated [email protected]: Glob versions prior to v9 are no longer supported
 WARN  deprecated [email protected]: Package no longer supported and required. Use the uuid package or crypto.randomUUID instead
 WARN  deprecated @humanwhocodes/[email protected]: Use @eslint/config-array instead
 WARN  deprecated [email protected]: This package is no longer supported.
 WARN  deprecated @humanwhocodes/[email protected]: Use @eslint/object-schema instead
 WARN  deprecated [email protected]: This package is no longer supported.
 WARN  deprecated [email protected]: Rimraf versions prior to v4 are no longer supported
 WARN  deprecated [email protected]: Rimraf versions prior to v4 are no longer supported
 WARN  deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-object-rest-spread instead.
 WARN  deprecated [email protected]: Use String.prototype.trim() instead
Packages: +921 -3
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-
Progress: resolved 1739, reused 1636, downloaded 3, added 921, done

devDependencies:
+ @modern-js/storybook 2.53.0
+ @storybook/addon-essentials 7.0.0 (8.1.9 is available)
+ react 17.0.0 (18.3.1 is available)
+ react-dom 17.0.0 (18.3.1 is available)

 WARN  Issues with peer dependencies found
.
└─┬ @modern-js/storybook 2.53.0
  └─┬ @storybook/react 7.6.19
    └─┬ react-element-to-jsx-string 15.0.0
      ├── ✕ unmet peer react@"^0.14.8 || ^15.0.1 || ^16.0.0 || ^17.0.1 || ^18.0.0": found 17.0.0
      └── ✕ unmet peer react-dom@"^0.14.8 || ^15.0.1 || ^16.0.0 || ^17.0.1 || ^18.0.0": found 17.0.0

Done in 50s
[INFO] dependencies are automatically installed
[INFO] Success!
[INFO] You can run pnpm run storybook to run stories.
❯ 
❯ 
❯ 
❯ 
❯ pnpm storybook

> [email protected] storybook /Users/Documents/librarys/wx-experience
> storybook dev -p 6006

@storybook/cli v7.6.19


attention => Storybook now collects completely anonymous telemetry regarding usage.
This information is used to shape Storybook's roadmap and prioritize features.
You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
https://storybook.js.org/telemetry

info => Starting manager..
info => Starting preview..
=> Failed to build the preview
Error: listen EADDRNOTAVAIL: address not available 198.18.17.88:6006
    at __node_internal_captureLargerStackTrace (node:internal/errors:496:5)
    at __node_internal_uvExceptionWithHostPort (node:internal/errors:593:12)
    at Server.setupListenHandle [as _listen2] (node:net:1800:21)
    at listenInCluster (node:net:1865:12)
    at GetAddrInfoReqWrap.doListen [as callback] (node:net:2014:7)
    at GetAddrInfoReqWrap.onlookup [as oncomplete] (node:dns:109:8)

WARN Broken build, fix the error above.
WARN You may need to refresh the browser.

✔ Would you like to help improve Storybook by sending anonymous crash reports? … yes
 ELIFECYCLE  Command failed with exit code 1.

复现链接

下面给出了最小demo。Below is the minimal demo.

复现步骤

wx-experience.zip

pnpm storybook

然后就报错了
Then an error occurred.