Project is in a non-functional state. Please fix or update docs.

[juni0r]

Environment

[email protected]
@nuxtjs/[email protected]

Reproduction

Create a fresh nuxt project and add the module as per documentation. Run storybook task.

Describe the bug

I tried to install storybook-nuxt in a fresh Nuxt project and it's not working. I followed the steps outlined in the docs, namely:

npx nuxi@latest module add storybook
npx storybook-nuxt init
npm run storybook

This won't work due to a missing package @storybook/vue3-vite...

npm i -D @storybook/[email protected]

results in

Error: Build failed with 1 error:
error: The entry point "vue" cannot be marked as external

Subsequent attempts to update packages and fixing mismatched peer dependencies will just result in cascades of incompatibilities and utlimate failure.

Additional context

Reading through various issues it appears that there's currently no clearly documented way to install the module and its dependencies in a working state. If you're unable to fix it it would be very much appreciated if you could at least update the documentation and add a warning that the project is in a non-functional state. It would have saved me a few hours trying to get it to work.

Thank you!

[bwaltz]

I second this. I am also running into issues with this project. Here are some messages

▶ npm run storybook      

> storybook
> storybook dev --port 6006

@storybook/cli v8.0.8

The CJS build of Vite's Node API is deprecated. See https://vite.dev/guide/troubleshooting.html#vite-cjs-node-api-deprecated for more details.

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: Cannot find @storybook/vue3-vite,
    at getPackageDir (./node_modules/@storybook-vue/nuxt/dist/preset.cjs:6805:9)
    at getStorybookViteConfig (./node_modules/@storybook-vue/nuxt/dist/preset.cjs:6767:64)
    at Object.viteFinal (./node_modules/@storybook-vue/nuxt/dist/preset.cjs:6773:51)
    at ./node_modules/@storybook/core-common/dist/index.js:12:1162

Which then you do npm install -D @storybook/vue3-vite and get:

npm install -D @storybook/vue3-vite        
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: undefined@undefined
npm ERR! Found: [email protected]
npm ERR! node_modules/storybook
npm ERR!   dev storybook@"8.0.8" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer storybook@"^8.4.4" from @storybook/[email protected]
npm ERR! node_modules/@storybook/vue3-vite
npm ERR!   dev @storybook/vue3-vite@"*" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

npm list reports:

npm list storybook                 
colby-storyblok@ /Users/bkwaltz/webroot/colby-storyblok
├─┬ @storybook-vue/[email protected]
│ ├─┬ @storybook/[email protected]
│ │ ├─┬ @storybook/[email protected]
│ │ │ └── [email protected] deduped
│ │ └── [email protected]
│ ├─┬ @storybook/[email protected]
│ │ └── [email protected] deduped
│ └─┬ @storybook/[email protected]
│   ├─┬ @storybook/[email protected]
│   │ └── [email protected] deduped
│   ├─┬ @storybook/[email protected]
│   │ └── [email protected] deduped
│   ├─┬ @storybook/[email protected]
│   │ └── [email protected] deduped
│   ├─┬ @storybook/[email protected]
│   │ └── [email protected] deduped
│   └── [email protected] deduped
└── [email protected]

How do we get to a working result?

[lafllamme]

@bwaltz @juni0r

You can have a look inside here at a correct package.json (afaik)

#776

[tobiasdiez]

#813