[Bug]: No matching export in "global-externals:@storybook/channels" for import "createBrowserChannel"

[dep]

Describe the bug

I'm making the following dependency updates

-    "@storybook/addon-actions": "7.0.24",
+    "@storybook/addon-actions": "7.3.2",
-    "@storybook/addon-controls": "7.0.24",
+    "@storybook/addon-controls": "7.3.2",
-    "@storybook/addons": "7.0.24",
+    "@storybook/addons": "7.4.0",
-    "@storybook/theming": "7.0.24",
+    "@storybook/theming": "7.4.0",

and getting a failure on the build-storybook command:

Error: R] No matching export in "global-externals:@storybook/channels" for import "createBrowserChannel"
    ../../../../node_modules/@storybook/preview-api/dist/chunk-KAFJUYUA.mjs:5:9:
      5 │ import { createBrowserChannel } from '@storybook/channels';
        ╵          ~~~~~~~~~~~~~~~~~~~~
ERR! Error: Build failed with 1 error:
ERR! ../../../../node_modules/@storybook/preview-api/dist/chunk-KAFJUYUA.mjs:5:9: ERROR: No matching export in "global-externals:@storybook/channels" for import "createBrowserChannel"

Thanks for any help!

To Reproduce

No response

System

No response

Additional context

No response

[spiess-demos]

Same error here after updating from 7.0.27. Relevant devDependencies:

    "@storybook/addon-actions": "7.4.0",
    "@storybook/addon-docs": "7.4.0",
    "@storybook/addon-essentials": "7.4.0",
    "@storybook/addon-links": "7.4.0",
    "@storybook/addon-mdx-gfm": "7.4.0",
    "@storybook/addon-styling-webpack": "^0.0.2",
    "@storybook/vue": "7.4.0",
    "@storybook/vue-webpack5": "7.4.0",

edit: we were just overlooking that the storybook dependency had to be updated to the same version the addons are using.

[dbsmck]

Same for me:

    "@nx/storybook": "16.5.5",
    "@storybook/addon-essentials": "7.0.25",
    "@storybook/addon-interactions": "^7.0.25",
    "@storybook/addon-links": "^7.0.25",
    "@storybook/core-common": "^7.0.25",
    "@storybook/core-server": "7.0.25",
    "@storybook/preset-create-react-app": "^7.0.25",
    "@storybook/react-vite": "7.0.25",

[lovin123]

Facing same issue. Relevant devDependencies

"@storybook/addon-actions": "^7.0.27",
"@storybook/addon-docs": "^7.0.27",
"@storybook/addon-essentials": "^7.0.27",
"@storybook/addon-interactions": "^7.0.27",
"@storybook/addon-links": "^7.0.27",
"@storybook/addon-mdx-gfm": "^7.0.27",
"@storybook/addon-measure": "^7.0.27",
"@storybook/addon-storysource": "^7.0.27",
"@storybook/blocks": "7.0.27",
"@storybook/cli": "^7.0.27",
"@storybook/nextjs": "7.0.27",
"@storybook/react": "^7.0.27",
"@storybook/testing-library": "^0.2.0",

[dbsmck]

Upgrading everything to 7.4.0 fixed it for me

[ahmad-demos]

Upgrading everything to 7.4.0 fixed it for me

it's working! Thnaks!

in package.json:
"storybook": "7.4.0"
then yarn install
then yarn storybook

[dep]

I have the same issue after upgrading to 7.4.0

"@storybook/addon-actions": "7.4.0",
"@storybook/addon-controls": "7.4.0",
"@storybook/addon-docs": "7.4.0",
"@storybook/addon-knobs": "7.0.2", // this is latest
"@storybook/addon-links": "7.4.0",
"@storybook/addons": "7.4.0",
"@storybook/channels": "7.4.0",
"@storybook/preset-scss": "1.0.3", // this is latest
"@storybook/react": "7.4.0",
"@storybook/react-webpack5": "7.4.0",
"@storybook/theming": "7.4.0",

[spiess-demos]

@dep did you also update the "storybook" devDependency to the same version?

[yannbf]

Hey everyone! thanks for opening this issue. Can you provide a reproduction repo? I'd really like to get to the bottom of this issue and fix it.

Can you also check whether npx storybook@latest automigrate mentions any warnings like so in your project?

[amiramix]

Hey everyone! thanks for opening this issue. Can you provide a reproduction repo? I'd really like to get to the bottom of this issue and fix it.

Can you also check whether npx storybook@latest automigrate mentions any warnings like so in your project?

In our case for some reason we had this dependency in the project:
"storybook": "future"

It was pulling @storybook/cli 7.1.0-alpha.29 instead of 7.4.6, like the rest of the project. This caused the 7.1.0-alpha.29 to be used to compile storybooks generated using the newer versions. And as a result we got this error:

@storybook/cli v7.1.0-alpha.29

info => Cleaning outputDir: /build
info => Loading presets
info => Building manager..
✘ [ERROR] No matching export in "global-externals:@storybook/channels" for import "createBrowserChannel"

    ../../node_modules/@storybook/preview-api/dist/chunk-KAFJUYUA.mjs:5:9:
      5 │ import { createBrowserChannel } from '@storybook/channels';
        ╵          ~~~~~~~~~~~~~~~~~~~~

All it took was to remove "storybook" dependency. I guess, like noted in other comments, the issue is caused by either compiling or recompiling storybook using incompatible versions.

Now the working log looks like this:

@storybook/cli v7.4.6

info => Cleaning outputDir: /build
info => Loading presets
info => Building manager..
info => Manager built (215 ms)
info => Compiling preview..
info => Copying static files:  <path-removed>
info Addon-docs: using MDX2
info => Using implicit CSS loaders
info => Loading custom Webpack config (full-control mode).
10% building 0/1 entries 0/0 dependencies 0/0 modulesUnexpected usage of "storyName" in "SomeComponent". Please use "name" instead.
...

[ivangabriele]

Hi ^^. Here is a reproduction PR: MTES-MCT/monitor-ui#891.

Reproducable both via yarn build:storybook (Github Actions Run) and Chromatic using chromaui/action@v1 (Github Actions Run).

UPDATE

Simply fixed by upgrading storybook to v7.5.3. Seems to happen when storybook and @storybook/addon-essentials versions are not aligned.