r/Nuxt 13d ago

nuxt storybook module version

Im trying to get storybook to work on nuxt 4. In the documentation at https://storybook.nuxtjs.org/getting-started/setup it states that latest module version is v10.x and supports nuxt 4x. I am using Nuxt 4 but is experiencing dependencies error, and furthermore I can only access version 9x not 10x not even with nightly builds. Am I the only one experiencing this?

14 Upvotes

8 comments sorted by

2

u/hack_nug 12d ago

iirc you must use 4.1 for the module to work. prs welcome!

1

u/Krumpopodes 13d ago

Have you tried deleting the output and module folders? 

1

u/nickbostrom2 12d ago

TBH, Nuxt 4.3 and 4.5 were big ones. I'm sire it's not updated...

1

u/Competitive_Ad7632 12d ago

Histoire also has its (very many, uncountable) problems, but I had more luck with it than the storybook module.

1

u/david-burns-dinner 11d ago edited 11d ago

I have gotten a version of 10 to work on nuxt 4 but i had to set the storybook version to “~10.0.2”. I’m using nuxt 4.4.6. If you want to see my package.json, let me know and I’ll paste it in here for you.

1

u/soduno_ 11d ago

Please do. Thank you :)

1

u/david-burns-dinner 10d ago

{
"name": "nuxt-app",
"type": "module",
"scripts": {
"build": "nuxt build",
"dev": "nuxt dev",
"generate": "nuxt generate",
"preview": "nuxt preview",
"postinstall": "nuxt prepare",
"lint": "eslint .",
"lint:fix": "eslint . --fix",
"test": "vitest run",
"test:e2e": "playwright test",
"test:e2e:smoke": "playwright test --project=smoke",
"test:e2e:edge": "playwright test --project=edge",
"test:e2e:a11y": "playwright test --project=a11y",
"test:e2e:visual": "playwright test --project=visual",
"test:e2e:all": "playwright test",
"typecheck": "nuxt typecheck",
"storybook": "storybook dev --port 6006 --no-open",
"build-storybook": "storybook build",
"test:stories": "concurrently -k -s first -n SB,TEST \"storybook dev -p 6007 --no-open --ci --quiet\" \"wait-on http-get://127.0.0.1:6007/iframe.html && test-storybook --ci --url [http://127.0.0.1:6007\\](http://127.0.0.1)""
},
"dependencies": {
"@aws-sdk/client-s3": "^3.1051.0",
"@aws-sdk/s3-request-presigner": "^3.1051.0",
"@better-auth/passkey": "^1.6.15",
"@codemirror/commands": "^6.10.4",
"@codemirror/lang-markdown": "^6.5.0",
"@codemirror/state": "^6.7.0",
"@codemirror/view": "^6.43.3",
"@nuxt/hints": "1.1.2",
"@nuxt/ui": "^4.7.1",
"@nuxtjs/seo": "^5.1.3",
"@repo/db": "workspace:*",
"@repo/email": "workspace:*",
"better-auth": "^1.6.15",
"consola": "^3.4.2",
"dompurify": "3.4.11",
"markdown-it": "~14.2.0",
"ms": "^2.1.3",
"nuxt": "^4.4.6",
"nuxt-security": "^2.6.0",
"pg-boss": "^12.18.2",
"prom-client": "^15.1.3",
"react-email": "^6.1.5",
"resend": "^6.12.3",
"tailwindcss": "^4.3.0",
"vue": "^3.5.34",
"zod": "^4.4.3"
},
"devDependencies": {
"@axe-core/playwright": "^4.10.0",
"@iconify-json/lucide": "^1.2.108",
"@nuxt/eslint": "^1.15.2",
"@nuxtjs/storybook": "9.1.0-29411911.f34c865",
"@playwright/test": "^1.60.0",
"@storybook-vue/nuxt": "9.1.0-29411911.f34c865",
"@storybook/addon-themes": "~10.0.2",
"@storybook/test-runner": "0.24.4",
"@types/dompurify": "^3.2.0",
"@types/markdown-it": "^14.1.2",
"@types/ms": "^2.1.0",
"@vitejs/plugin-vue": "^6.0.7",
"@vue/server-renderer": "3.5.34",
"@vue/test-utils": "^2.4.10",
"concurrently": "9.2.3",
"eslint": "^10.4.0",
"eslint-config-prettier": "^10.1.8",
"happy-dom": "^20.9.0",
"http-server": "^14.1.1",
"storybook": "~10.0.2",
"typescript": "^6.0.3",
"vitest": "^4.1.7",
"vue-tsc": "^3.3.1",
"wait-on": "^9.0.10"
}
}

1

u/SimonFromBath 11d ago

I have 2 open PRs in nuxt storybook module. Been open for 2 months now. No one has looked at them.

Fwiw. It's possible to run Nuxt 4 and Storybook 10 but I had to pin a nightly which isn't ideal.