nuxt-modules / storybook

Storybook integration with Nuxt.
https://storybook.nuxtjs.org
403 stars 93 forks source link

Local examples do not build correctly #699

Closed obulat closed 2 months ago

obulat commented 2 months ago

Description

Building storybook for examples only renders the sample Nuxt welcome page story and not the stories from the example

Reproduction

  1. Set up the repo dependencies

    • pnpm install
    • pnpm example:showcase:build
  2. Build the showcase app: pnpm example:showcase:storybook:build

  3. Run an http server inside the built directory (I used npx http-server).

  4. Go to the rendered page, see the error: there are error messages:

    
    (0 , n.platform) is not a function
    The component failed to render properly, likely due to a configuration issue in Storybook. Here are some common causes and how you can address them:

Missing Context/Providers: You can use decorators to supply specific contexts or providers, which are sometimes necessary for components to render correctly. For detailed instructions on using decorators, please visit the Decorators documentation. Misconfigured Webpack or Vite: Verify that Storybook picks up all necessary settings for loaders, plugins, and other relevant parameters. You can find step-by-step guides for configuring Webpack or Vite with Storybook. Missing Environment Variables: Your Storybook may require specific environment variables to function as intended. You can set up custom environment variables as outlined in the Environment Variables documentation. TypeError: (0 , n.platform) is not a function at http://127.0.0.1:8081/_nuxt/LMqgjtiu.js:22:10645 at http://127.0.0.1:8081/_nuxt/LMqgjtiu.js:23:486 at http://127.0.0.1:8081/_nuxt/LMqgjtiu.js:23:512 at ba (http://127.0.0.1:8081/_nuxt/LMqgjtiu.js:23:515) at va (http://127.0.0.1:8081/_nuxt/LMqgjtiu.js:451:37066) at http://127.0.0.1:8081/_nuxt/LMqgjtiu.js:451:37161



Might be related to `os.platform` in jiti: https://github.com/unjs/jiti/blob/e78daeb2a127d2686b45abe606f39a25efbbf769/src/jiti.ts#L23
tobiasdiez commented 2 months ago

For me this is working (now). Which OS do you use?

obulat commented 2 months ago

For me this is working (now). Which OS do you use?

I'm on MacOS.

After the latest PRs, I don't get the os.platform errors, and the first component's story looks fine. However, it has warnings in the console:

De66xnrA.js:5 [nuxt] error caught during app initialization TypeError: Cannot read properties of undefined (reading 'cdnURL')
    at e (BGOWv8qc.js:1:209)
    at b (BGOWv8qc.js:1:174)
    at mt (D8wL0etK.js:7:6272)
    at A (D8wL0etK.js:7:6458)
    at K (D8wL0etK.js:7:6492)
    at D8wL0etK.js:7:19552
    at r (De66xnrA.js:5:25148)
    at Object.runWithContext (CR8tLLMx.js:13:22037)
    at ze (De66xnrA.js:5:25187)
    at De66xnrA.js:5:23338

Caused by: TypeError: Cannot read properties of undefined (reading 'cdnURL')
    at e (BGOWv8qc.js:1:209)
    at b (BGOWv8qc.js:1:174)
    at mt (D8wL0etK.js:7:6272)
    at A (D8wL0etK.js:7:6458)
    at K (D8wL0etK.js:7:6492)
    at D8wL0etK.js:7:19552
    at r (De66xnrA.js:5:25148)
    at Object.runWithContext (CR8tLLMx.js:13:22037)
    at ze (De66xnrA.js:5:25187)
    at De66xnrA.js:5:23338

And whenever you navigate to a story after the first one, you get a "context conflict" error:

Error: Context conflict
  at Object.set (/_nuxt/wUNKFxcx.js:1:501))
  at ze (/_nuxt/BRbuM_95.js:5:25171))
  at /_nuxt/BRbuM_95.js:5:23338
  at yr.run (/_nuxt/CR8tLLMx.js:9:267))
  at Object.runWithContext (/_nuxt/BRbuM_95.js:5:23330))
  at kn (/_nuxt/BRbuM_95.js:5:24447))
  at g (/_nuxt/BRbuM_95.js:5:24765))
  at In (/_nuxt/BRbuM_95.js:5:25022))
  at /_nuxt/B9XsslVS.js:7:22787
tobiasdiez commented 2 months ago

The first two errors seem to be harmless, although it would be good to fix them of course.

I do experience the context conflict error or sometimes a nuxt instance error when switching stories, see https://github.com/nuxt-modules/storybook/issues/661. Usually, one just needs to reload the page and then the story shows correctly. Did not yet found the time to investigate this.

Closing as the original is fixed now.