Invalid value of '@storybook/react' in the 'framework' field of Storybook config.

[softhedev]

Hi,

When trying to run yarn storybook, it gives the following error:

`WARN Storybook will use the first one found and ignore the others. Please remove the extra files.
SB_CORE-COMMON_0002: Invalid value of '@storybook/react' in the 'framework' field of Storybook config.

Please run 'npx storybook@next automigrate' to automatically fix your config.

More info: https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#new-framework-api

at validateFrameworkName (./node_modules/@storybook/core-common/dist/index.js:52:4177)
at buildDevStandalone (./node_modules/@storybook/core-server/dist/index.js:116:1467)
at async withTelemetry (./node_modules/@storybook/core-server/dist/index.js:101:4155)
at async dev (./node_modules/@storybook/cli/dist/generate.js:502:401)
at async Command.<anonymous> (./node_modules/@storybook/cli/dist/generate.js:504:225)

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

Anybody experiences the same issue or already found an answer to this?

[Daniel-Alamezie]

I think the issue you are seeing is as a result of an issue with the configuration of your storybook project. Specifically, it's complaining about an invalid value in the 'framework' field of your Storybook config. To resolve this issue, you can follow the suggested steps:

Run the npx storybook@next automigrate command as suggested in the error message. This command will attempt to automatically fix your Storybook configuration:

After running the automigrate command, it should attempt to update your Storybook configuration to be compatible with the new framework API. Make sure to carefully review the changes it makes to your configuration.

If the automigrate command doesn't resolve the issue or if you want to manually update your configuration, you should check your Storybook configuration file (typically named .storybook/main.js or similar) for the 'framework' field. Ensure that you have specified the correct framework, which should be '@storybook/react' if you are using React as your framework.

for example:

module.exports = {
// Other configuration options...
core: {
builder: "webpack5",
},
framework: "@storybook/react", // Make sure this is set correctly.
};

After making these changes, try running yarn storybook again. Hopefully, the error will be resolved, and Storybook should start without any issues.

Hopefully that helps