Storybook启动报错：已配置main.js框架仍提示需指定框架

算力阿峰

2026-7-25

解决方案

针对你遇到的「必须在.storybook/main.js中指定framework」错误，即便已经配置了该字段，可能的原因及解决方法如下：

1. 调整framework字段的配置格式

Storybook 6.5.x版本中，搭配webpack5 builder使用时，部分场景下framework字段需要以对象形式配置，而非直接写字符串。修改你的main.js：

module.exports = {
  "stories": [
    "../src/**/*.stories.mdx",
    "../src/**/*.stories.@(js|jsx|ts|tsx)"
  ],
  "addons": [
    "@storybook/addon-links",
    "@storybook/addon-essentials",
    "@storybook/addon-interactions"
  ],
  "framework": {
    "name": "@storybook/react",
    "options": {}
  },
  "core": {
    "builder": "@storybook/builder-webpack5",
    "disableTelemetry": "true"
  }
}

2. 清除Storybook缓存

缓存可能导致配置未被正确读取，执行以下命令清除缓存后重新启动：

npm run storybook -- --no-manager-cache

3. 修复依赖兼容性问题

确认@storybook/builder-webpack5版本与@storybook/react（6.5.16）完全匹配，重新安装对应版本：
```
npm install @storybook/builder-webpack5@6.5.16 --save-dev
```
移除@storybook/preset-create-react-app，该预设在webpack5 builder环境下可能引发配置冲突：
```
npm uninstall @storybook/preset-create-react-app
```