search

storybook-vue / nuxt-storybook

Storybook Module for Nuxt Framework
18 stars 0 forks source link

Use storybook's buildDevStandalone to start dev server #1

Open tobiasdiez opened 1 year ago

tobiasdiez commented 1 year ago

Currently the module uses the storybook cli to start the dev server in a new process. I think its more flexible and convenient to use storybooks buildDevStandalone for this. You can have a look at https://github.com/JabRef/JabRefOnline/blob/main/modules/storybook.ts on how this can be done.

ineshbose commented 9 months ago

Similar usage: https://github.com/nuxt-modules/tailwindcss/issues/793#issuecomment-1894012939

lud-hu commented 9 months ago

Hi @tobiasdiez ,

since none of the available storybook modules seem to work properly I tried to get your solution up and running but I'm running into this error:

 ERROR  EISDIR: illegal operation on a directory, read                                                                                                                      8:49:45 AM

  at Object.readSync (node:fs:744:3)
  at tryReadSync (node:fs:444:20)
  at readFileSync (node:fs:490:19)
  at jiti (node_modules/jiti/dist/jiti.js:1:254438)
  at node_modules/@storybook/core-server/dist/index.js:51:2268
  at async getPreviewBuilder (node_modules/@storybook/core-server/dist/index.js:51:2172)
  at async Promise.all (index 0)
  at async buildDevStandalone (node_modules/@storybook/core-server/dist/index.js:119:2418)
  at async startStorybookServer (modules/storybook.ts:22:10)
  at async modules/storybook.ts:88:31

Do you have an idea what the problem might be? I cannot manage to debug it... :(

tobiasdiez commented 9 months ago

That points to https://github.com/storybookjs/storybook/blob/5428db705fbb312bb3712b5d2a4fdc072bb17c14/code/lib/core-server/src/utils/get-builders.ts#L17, right? Do you have the right builder package installed?

lud-hu commented 9 months ago

Thanks @tobiasdiez ! I really don't know why, but after switching over from 

framework: {
    name: '@storybook/vue3-vite',
    options: {},
  },

to

framework: {
    name: '@storybook/nuxt',
    options: {},
  },

solved this particular issue.

Now I at least get the story rendered but it seems like there is no styling applied and e.g. <NuxtIcon /> is not rendered as well. Is there anything more to take into account in your solution then:

?