Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug]: Since version 8.4.2 when run npm run storybook it show html code instead of Storybook UI on browser with webpack 5 configruation. #29646

Open
aleleba opened this issue Nov 18, 2024 · 1 comment

Comments

@aleleba
Copy link

aleleba commented Nov 18, 2024

Describe the bug

Since version 8.4.2 when run npm run storybook it show html code instead of Storybook UI on browser with webpack 5 configruation.
Example:
Image

Reproduction link

https://github.com/aleleba/create-react-component-library/tree/reproducing-browser-html-issue

Reproduction steps

  1. execute npm run storybook on a webpack 5 configuration storybook app.

Note: to reproduce use this repo and branch: https://github.com/aleleba/create-react-component-library/tree/reproducing-browser-html-issue

System

Storybook Environment Info:

  System:
    OS: Linux 4.4 Ubuntu 22.04.5 LTS 22.04.5 LTS (Jammy Jellyfish)
    CPU: (4) x64 AMD Ryzen Embedded R1600
    Shell: 5.1.16 - /bin/bash
  Binaries:
    Node: 22.11.0 - ~/.nvm/versions/node/v22.11.0/bin/node
    npm: 10.9.0 - ~/.nvm/versions/node/v22.11.0/bin/npm <----- active
  Browsers:
    Chrome: 130.0.6723.91
  npmPackages:
    @storybook/addon-actions: ^8.4.4 => 8.4.4 
    @storybook/addon-docs: ^8.4.4 => 8.4.4 
    @storybook/addon-essentials: ^8.4.4 => 8.4.4 
    @storybook/addon-interactions: ^8.4.4 => 8.4.4 
    @storybook/addon-links: ^8.4.4 => 8.4.4 
    @storybook/addon-styling-webpack: ^1.0.1 => 1.0.1 
    @storybook/addon-webpack5-compiler-babel: ^3.0.3 => 3.0.3 
    @storybook/blocks: ^8.4.4 => 8.4.4 
    @storybook/cli: ^8.4.4 => 8.4.4 
    @storybook/mdx2-csf: ^1.1.0 => 1.1.0 
    @storybook/preset-scss: ^1.0.3 => 1.0.3 
    @storybook/react: ^8.4.4 => 8.4.4 
    @storybook/react-webpack5: ^8.4.4 => 8.4.4 
    @storybook/testing-library: ^0.2.2 => 0.2.2 
    eslint-plugin-storybook: ^0.11.0 => 0.11.0 
    storybook: ^8.4.4 => 8.4.4

Additional context

I am upgrading to 8.4 from a 8.3 app of storybook.

To reproduce use this repo and branch: https://github.com/aleleba/create-react-component-library/tree/reproducing-browser-html-issue

@shilman
Copy link
Member

shilman commented Nov 19, 2024

I checked out your repro and it serves properly for me. Here's my local config:

Storybook Environment Info:

  System:
    OS: macOS 15.1
    CPU: (10) arm64 Apple M1 Pro
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.20.3 - /usr/local/bin/node
    Yarn: 1.22.22 - /usr/local/bin/yarn
    npm: 10.7.0 - /usr/local/bin/npm <----- active
  Browsers:
    Chrome: 131.0.6778.70
    Safari: 18.1
  npmPackages:
    @storybook/addon-actions: ^8.4.4 => 8.4.4 
    @storybook/addon-docs: ^8.4.4 => 8.4.4 
    @storybook/addon-essentials: ^8.4.4 => 8.4.4 
    @storybook/addon-interactions: ^8.4.4 => 8.4.4 
    @storybook/addon-links: ^8.4.4 => 8.4.4 
    @storybook/addon-styling-webpack: ^1.0.1 => 1.0.1 
    @storybook/addon-webpack5-compiler-babel: ^3.0.3 => 3.0.3 
    @storybook/blocks: ^8.4.4 => 8.4.4 
    @storybook/cli: ^8.4.4 => 8.4.4 
    @storybook/mdx2-csf: ^1.1.0 => 1.1.0 
    @storybook/preset-scss: ^1.0.3 => 1.0.3 
    @storybook/react: ^8.4.4 => 8.4.4 
    @storybook/react-webpack5: ^8.4.4 => 8.4.4 
    @storybook/testing-library: ^0.2.2 => 0.2.2 
    eslint-plugin-storybook: ^0.11.0 => 0.11.0 
    storybook: ^8.4.4 => 8.4.4 

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants