storybook-vue / storybook-nuxt

Storybook integration for Nuxt Framework - Unleashing the power of Storybook in Nuxt/Vue Land!"
133 stars 19 forks source link

Error: Could not evaluate the @storybook-vue/nuxt package from the 'framework' field of Storybook config. #3

Open productdevbook opened 11 months ago

productdevbook commented 11 months ago

image

g1ronn1mo commented 11 months ago

Same here

And I got htis Error:

WARN Failed to load preset: "@storybook-vue\nuxt\preset" ERR! C:\Users\benes\Scripts\nuxt3-frontend-webapp\nodemodules.pnpm\@storybook-vue+nuxt@0.0.1-rc.1@types+node@18.17.1_bqclbv554zvc6fjyuiui45kypq\node_modules\@storybook-vue\nuxt\dist\preset.mjs:1 ERR! import { join } from 'path'; ERR! ^^^^^^ ERR! ERR! SyntaxError: Cannot use import statement outside a module ERR! at internalCompileFunction (node:internal/vm:73:18) ERR! at wrapSafe (node:internal/modules/cjs/loader:1149:20) ERR! at Module._compile (node:internal/modules/cjs/loader:1190:27) ERR! at Module._extensions..js (node:internal/modules/cjs/loader:1280:10) ERR! at Object.newLoader [as .mjs] (C:\Users\benes\Scripts\nuxt3-frontend-webapp\node_modules.pnpm\esbuild-register@3.4.2_esbuild@0.18.17\node_modules\esbuild-register\dist\node.js:2262:9) ERR! at Module.load (node:internal/modules/cjs/loader:1089:32) ERR! at Module._load (node:internal/modules/cjs/loader:930:12) ERR! at Module.require (node:internal/modules/cjs/loader:1113:19) ERR! at require (node:internal/modules/cjs/helpers:103:18) ERR! at Object. (C:\Users\benes\Scripts\nuxt3-frontend-webapp\nodemodules.pnpm\@storybook-vue+nuxt@0.0.1-rc.1@types+node@18.17.1_bqclbv554zvc6fjyuiui45kypq\node_modules\@storybook-vue\nuxt\preset.js:1:18) ERR! C:\Users\benes\Scripts\nuxt3-frontend-webapp\nodemodules.pnpm\@storybook-vue+nuxt@0.0.1-rc.1@types+node@18.17.1_bqclbv554zvc6fjyuiui45kypq\node_modules\@storybook-vue\nuxt\dist\preset.mjs:1

chakAs3 commented 11 months ago

Hi @productdevbook , @g1ronn1mo I'm working on fixing some issues related to package resolutions, it will be fixed today.

youngcadam commented 6 months ago

did this ever get resolved? encountering the same error with my nuxt application image

necodeus commented 6 months ago

It looks like Storybook doesn't work well on Windows. Installing Storybook on Linux solved the problem.

Try this on Windows ⬇️

nuxt.config.ts

   // ...
   modules: [
      '@storybook-vue/nuxt-storybook',
   ],
   // ...

.storybook/main.ts

import type { StorybookConfig } from "@storybook-vue/nuxt";

const config: StorybookConfig = {
    stories: [
        "../stories/**/*.stories.ts",
    ],
    addons: [
        "@storybook/addon-links",
        "@storybook/addon-interactions",
    ],
    framework: {
        name: "@storybook-vue/nuxt",
        options: {},
    },
    docs: {
        autodocs: "tag",
    },
};

export default config;

Install the packages:

yarn add -D @nuxtjs/storybook @storybook-vue/nuxt @storybook-vue/nuxt-storybook @storybook/addon-interactions @storybook/addon-links @storybook/builder-vite @storybook/testing-library @storybook/vue3 storybook

😒

chakAs3 commented 6 months ago

Hi @necodeus to get your storybook app working use just @storybook-vue/nuxt latest version it should work on windows, otherwise create a repro repo for me to look at it.

DanRoddis commented 3 months ago

When running this on Windows with Nuxt 3.11 the steps listed by necodeus were still required otherwise the error was still present, this is in a clean install of Nuxt 3.11