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

With storybook@8.0.5 and storybook-addon-pseudo-states@3.0.0: Uncaught ReferenceError: Icons is not defined #111

Closed
wegry opened this issue Mar 29, 2024 · 1 comment · Fixed by #112
Labels
released This issue/pull request has been released.

Comments

@wegry
Copy link
Contributor

wegry commented Mar 29, 2024

Similarly to #108 (comment), I'm seeing stories fail to render when storybook-addon-pseudo-states is enabled.

Uncaught ReferenceError: Icons is not defined
    at B (manager-bundle.js:2:6698)
    at renderWithHooks (chunk-UOBNU442.js:92:907)
    at mountIndeterminateComponent (chunk-UOBNU442.js:96:25851)
    at beginWork (chunk-UOBNU442.js:98:28381)
    at HTMLUnknownElement.callCallback2 (chunk-UOBNU442.js:31:42734)
    at Object.invokeGuardedCallbackImpl (chunk-UOBNU442.js:31:43261)
    at invokeGuardedCallback (chunk-UOBNU442.js:31:44569)
    at beginWork$1 (chunk-UOBNU442.js:115:5396)
    at performUnitOfWork (chunk-UOBNU442.js:111:56150)
    at workLoopSync (chunk-UOBNU442.js:111:54884)

Things of note in my project:

  1. We're still on React 17. Maybe this is conflicting somehow with this storybook change.
  2. We're using @storybook/addon-webpack5-compiler-babel. We can't use swc (and are still using babel) because of styled-jsx incompatibilities.
  3. Using Yarn 4.
// .storybook/main.ts
import {dirname, join} from 'node:path';
import type {StorybookConfig} from '@storybook/react-webpack5';
export default {
  core: {
    disableTelemetry: true, // 👈 Disables telemetry
  },
  addons: [
    {
      name: 'storybook-addon-swc',
      options: {
        enable: true,
        // styled-jsx doesn't work with PnP and swc-loader
        enableSwcLoader: false,
        enableSwcMinify: true,
        swcLoaderOptions: {},
        swcMinifyOptions: {},
      },
    },
    ...[
      '@storybook/addon-webpack5-compiler-babel',
      '@storybook/addon-controls',
      '@storybook/addon-actions',
      'storybook-dark-mode',
      '@storybook/addon-docs',
      '@storybook/addon-measure',
      // Stories render with this addon commented out.
      'storybook-addon-pseudo-states',
      '@storybook/addon-viewport',
      '@storybook/addon-interactions',
    ].map(getAbsolutePath),
  ],
  typescript: {
    // The default react-docgen can't handle template literals
    reactDocgen: 'react-docgen-typescript',
  },
  stories: ['**/*.stories.@(ts|tsx)'],
  framework: '@storybook/react-webpack5',
  docs: {
    defaultName: 'Overview',
    autodocs: true,
  },
} satisfies StorybookConfig;

export const framework = getAbsolutePath('@storybook/react');

function getAbsolutePath(value: string) {
  return dirname(require.resolve(join(value, 'package.json')));
}
ghengeveld added a commit that referenced this issue Mar 30, 2024
Copy link

🚀 Issue was released in v3.0.1 🚀

@github-actions github-actions bot added the released This issue/pull request has been released. label Mar 30, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
released This issue/pull request has been released.
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant