[Bug]: storybook init produces broken build (NextJS / React).

[JamesonRGrieve]

Describe the bug

Running npx stroybook init successfully sets everything up, launches the browser, then throws a large chain of errors stemming from:

info => Using implicit CSS loaders
info => Using default Webpack5 setup
<i> [webpack-dev-middleware] wait until bundle finished
99% end closing watch compilationWARN Force closed preview build
ModuleNotFoundError: Module not found: Error: Can't resolve '@storybook/components/experimental' 

followed by several errors pertaining to missing svg files including:

• code-brackets.svg
• colors.svg
• comments.svg
• direction.svg
• flow.svg
• plugin.svg
• repo.svg
• stackalt.svg

ending in

WARN Broken build, fix the error above.
WARN You may need to refresh the browser.

error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

This is a clean repo as far as storybook. Deleted node_modules, .storybook and stories.

Packages excerpt:

  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint",
    "storybook": "storybook dev -p 6006",
    "build-storybook": "storybook build"
  },
  "dependencies": {
    "@emotion/react": "^11.10.8",
    "@emotion/styled": "^11.10.8",
    "@mui/material": "^5.12.3",
    "contentful": "^10.1.4",
    "google-auth-library": "^9.0.0",
    "leaflet": "^1.9.3",
    "next": "13.4.0",
    "next-hubspot": "^1.1.6",
    "next-swagger-doc": "^0.4.0",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-leaflet": "^4.2.1",
    "sharp": "^0.32.1",
    "swagger-jsdoc": "^6.2.8",
    "swagger-ui-react": "^5.4.2",
    "swr": "^2.1.5"
  },
  "devDependencies": {
    "@babel/core": "^7.0.0-0",
    "@storybook/addon-essentials": "^7.0.6",
    "@storybook/addon-interactions": "^7.0.6",
    "@storybook/addon-links": "^7.0.6",
    "@storybook/addon-onboarding": "1.0.8",
    "@storybook/blocks": "^7.0.6",
    "@storybook/jest": "^0.1.0",
    "@storybook/nextjs": "^7.0.12",
    "@storybook/react": "^7.0.6",
    "@storybook/testing-library": "^0.0.14-next.2",
    "@types/react": "^18.0.28",
    "@types/react-dom": "^18.0.11",
    "esbuild": "latest",
    "eslint": "8.39.0",
    "eslint-config-next": "13.4.0",
    "eslint-plugin-storybook": "^0.6.12",
    "msw": "^1.2.1",
    "msw-storybook-addon": "^1.8.0",
    "openapi-types": "latest",
    "prop-types": "^15.8.1",
    "storybook": "^7.0.6",
    "typescript": "5.2.2",
    "webpack": "^5.0.0"
  }

To Reproduce

Run npx storybook init in a NextJS 13 application.

System

Environment Info:

  System:
    OS: Windows 10 10.0.22621       
    CPU: (20) x64 12th Gen Intel(R) Core(TM) i7-12700KF
  Binaries:
    Node: 18.16.1 - D:\nodejs\node.EXE
    Yarn: 1.22.19 - D:\nodejs\yarn.CMD
    npm: 9.5.1 - D:\nodejs\npm.CMD  
  Browsers:
    Chrome: 116.0.5845.111
    Edge: Spartan (44.22621.2134.0), Chromium (116.0.1938.54)
  npmPackages:
    @storybook/addon-essentials: ^7.0.6 => 7.3.2
    @storybook/addon-interactions: ^7.0.6 => 7.3.2
    @storybook/addon-links: ^7.0.6 => 7.3.2
    @storybook/addon-onboarding: 1.0.8 => 1.0.8
    @storybook/blocks: ^7.0.6 => 7.3.2
    @storybook/jest: ^0.1.0 => 0.1.0

    @storybook/nextjs: ^7.0.12 => 7.0.12
    @storybook/react: ^7.0.6 => 7.3.2
    @storybook/testing-library: ^0.0.14-next.2 => 0.0.14-next.2

Additional context

No response

[JamesonRGrieve]

Did a complete build of a brand new NextJS 13 project and it works, so I'm at a loss as to what in the existing project could cause it to break.

[vanessayuenn]

@JamesonRGrieve could you try clearing node_modules and reinstalling? This was reported in previous versions and folks were able to solve this by doing a clean reinstall.

[github-actions[bot]]

Hi there! Thank you for opening this issue, but it has been marked as stale because we need more information to move forward. Could you please provide us with the requested reproduction or additional information that could help us better understand the problem? We'd love to resolve this issue, but we can't do it without your help!

[github-actions[bot]]

I'm afraid we need to close this issue for now, since we can't take any action without the requested reproduction or additional information. But please don't hesitate to open a new issue if the problem persists – we're always happy to help. Thanks so much for your understanding.