[Bug] Style rendering broken in >=0.4.1

[steffex]

What version of vite are you using?

3.2.4

System info and storybook versions

System:
OS: macOS 13.1 (22C65)
CPU: Apple M2
Binaries:
Node: 16.18.1 - ~/.nvm/versions/node/v16.18.1/bin/node
Yarn: 1.22.19 - /opt/homebrew/bin/yarn
npm: 8.19.2 - ~/.nvm/versions/node/v16.18.1/bin/npm
Browsers:
Chrome: 109.0.5414.119
npmPackages:
@storybook/web-components: ^6.5.16
@storybook/addon-actions: ^6.5.16
@storybook/addon-essentials: ^6.5.16
@storybook/addon-links: ^6.5.16
@storybook/addon-a11y: ^6.5.16
@storybook/builder-vite: ^0.4.2

Describe the Bug

After 0.4.0 breaking rendering of the MDX files, if updated to 0.4.2 the rendering works again but all styling previously being applied is no longer applied (see screenshots)

<0.4.0:

>=0.4.x:

Link to Minimal Reproducible Example

No response

Participation

• I am willing to submit a pull request for this issue.

[IanVS]

Thanks for reporting, I'll take a look soon. In the meantime, you can stick with 0.3.x since you are using vite 3.

[joerobot]

Same issue here on Vite ^4.1.4.

Environment Info:

  System:
    OS: macOS 13.2.1
    CPU: (10) arm64 Apple M1 Max
  Binaries:
    Node: 16.11.1 - ~/Library/Caches/fnm_multishells/3196_1677059622734/bin/node
    Yarn: 1.22.11 - ~/Library/Caches/fnm_multishells/3196_1677059622734/bin/yarn
    npm: 8.0.0 - ~/Library/Caches/fnm_multishells/3196_1677059622734/bin/npm
  Browsers:
    Chrome: 110.0.5481.177
    Firefox: 110.0
    Safari: 16.3
  npmPackages:
    @storybook/addon-a11y: ^6.5.16 => 6.5.16
    @storybook/addon-actions: ^6.5.16 => 6.5.16
    @storybook/addon-essentials: ^6.5.16 => 6.5.16
    @storybook/addon-links: ^6.5.16 => 6.5.16
    @storybook/builder-vite: ^0.4.2 => 0.4.2
    @storybook/components: ^6.5.16 => 6.5.16
    @storybook/core-events: ^6.5.16 => 6.5.16
    @storybook/react: ^6.5.16 => 6.5.16
    @storybook/theming: ^6.5.16 => 6.5.16

[AndrewLeedham]

Likewise, looks like classes aren't getting added to the transformed markdown when upgrading to Vite@4 and @storybook/[email protected].

Before upgrading:

After upgrading:

npx storybook info output:

Environment Info:

  System:
    OS: macOS 13.2.1
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
  Binaries:
    Node: 16.18.0 - ~/.nvm/versions/node/v16.18.0/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 8.19.3 - ~/.nvm/versions/node/v16.18.0/bin/npm
  Browsers:
    Safari: 16.3
  npmPackages:
    @storybook/addon-a11y: 6.5.16 => 6.5.16 
    @storybook/addon-essentials: 6.5.16 => 6.5.16 
    @storybook/addon-links: 6.5.16 => 6.5.16 
    @storybook/addon-storyshots: 6.5.16 => 6.5.16 
    @storybook/addon-storysource: 6.5.16 => 6.5.16 
    @storybook/builder-vite: 0.4.2 => 0.4.2 
    @storybook/design-system: 7.7.9 => 7.7.9 
    @storybook/react: 6.5.16 => 6.5.16 
    @storybook/testing-react: 1.3.0 => 1.3.0 
    @storybook/theming: 6.5.16 => 6.5.16

[IanVS]

Please upgrade to Storybook 7 for Vite 4 compatibility.