[Bug]: error npm install @storybook/[email protected]

[kantesilvestrsTWL]

Describe the bug

When installing @storybook/[email protected] error is thrown 287 verbose stack Error: Unsupported URL Type "workspace:": workspace:*

To Reproduce

npm install @storybook/[email protected]

System

node v20.11.0
npm 10.2.4

Additional context

$ npm install
npm ERR! code EUNSUPPORTEDPROTOCOL
npm ERR! Unsupported URL Type "workspace:": workspace:*

[marcomontalbano]

I was facing the same issue by upgrading to 7.6.18, so I finally took the opportunity to remove that dependency.

@storybook/addon-mdx-gfm is deprecated. You can read here how to use the remark-gfm dependency instead.

It's only a matter of installing [email protected] and update your .storybook/main.ts this way:

+ import remarkGfm from 'remark-gfm';

  // Replace your-framework with the framework you are using (e.g., react-webpack5, vue3-vite)
  import type { StorybookConfig } from '@storybook/your-framework';

  const config: StorybookConfig = {
    framework: '@storybook/your-framework',
    stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
    addons: [
      // Other addons go here
+     {
+       name: '@storybook/addon-docs',
+       options: {
+         mdxPluginOptions: {
+           mdxCompileOptions: {
+             remarkPlugins: [remarkGfm],
+           },
+         },
+       },
+     },
    ],
  };

  export default config;

You've to use the v3.x. The v4.x doesn't work with storybook v7.x

[bbkx226]

@marcomontalbano Thanks!

[miladpav]

It seems this issue related to some sort of changes in major version API's , in releases sequence 8.0.0-beta.4 is next release of 7.6.17. so when you change addon-mdx-gfm to 8.0.0-beta.4 up to 8.0.9 versions works fine.
We face this issue from 1 week to 3 week ago from this comment.

I found 4 solutions to resolve this.
Solutions:

1. If you want work with exact version of your dependencies like 7.6.16. You can first install single addon-mdx-gfm then install whole package

npm install @storybook/[email protected] --loglevel verbose && npm install --loglevel verbose

OR

yarn add @storybook/[email protected] --verbose && yarn install --verbose

2. Like what storybook website said Once you've made the necessary changes, you can remove the addon from your package.json and storybook config. you can just remove that.

3. as what @marcomontalbano said, ignore this addon and handle with remark-gfm. refrence of storybook website: https://storybook.js.org/docs/writing-docs/mdx#markdown-tables-arent-rendering-correctly

4. Like @cw-natejohnson said just upgrade to version 8.*.*. "@storybook/addon-mdx-gfm": "^8.0.9",
   [Bug]: Can not install @storybook/node-logger on yarn v3,v4 #26932 (comment)

[JReinhold]

This should be fixed now in version 7.6.19. https://github.com/storybookjs/storybook/releases/tag/v7.6.19

Run npx [email protected] upgrade to upgrade.