加入直播会话:美国东部时间周四上午 11 点,Storybook 9 发布及 AMA
文档
Storybook Docs

升级 Storybook

前端生态系统发展迅速。无论是升级框架、库、工具,还是以上所有,定期升级依赖项都是常态!Storybook 提供了一些资源来帮助减轻升级的痛苦。

升级脚本

最常见的升级是 Storybook 本身。Storybook 版本遵循语义化版本控制。我们持续发布包含 bug 修复的补丁版本,每隔几个月发布带有新功能的 Storybook 次要版本,以及每年发布一次带有重大变更的 Storybook 主要版本。

为了帮助减轻保持 Storybook 最新状态的痛苦,我们提供了一个命令行脚本

npx storybook@next upgrade

upgrade 命令将使用您指定的任何版本。例如

  • storybook@latest upgrade 将升级到最新版本
  • storybook@8.6.1 upgrade 将升级到 8.6.1
  • storybook@9 upgrade 将升级到最新的 9.x.x 版本

upgrade 命令旨在从一个主要版本升级到下一个主要版本。

  • ✅ 正确:使用 Storybook 8 并运行 storybook@9 upgrade
  • ❌ 错误:使用 Storybook 7 并运行 storybook@9 upgrade

如果您想跨多个主要版本升级,请多次运行该命令。例如,要从 Storybook 7 升级到 Storybook 9,您需要先使用 storybook@8 upgrade 升级到 Storybook 8 的最新版本,然后运行 storybook@9 upgrade 升级到 Storybook 9 的最新版本。

唯一的例外是从 6 升级到 8 时,您可以直接运行 storybook@8 upgrade 从 6.x.x 升级到 8.x.x。

运行该命令后,脚本将

  • 将项目中所有 Storybook 包升级到指定版本
  • 运行相关的automigrations,考虑当前版本与指定版本之间的重大变更

除了运行该命令外,我们还建议查阅MIGRATION.md 文件,以获取可能影响您升级的相关变更和弃用的详细日志。

验证升级

为了帮助您验证升级是否完成以及项目是否按预期工作,Storybook CLI 提供了doctor 命令,允许您对项目进行健康检查,以查找升级后可能出现的常见问题,例如重复的依赖项、不兼容的插件或版本不匹配。要执行健康检查,请使用您选择的包管理器运行以下命令

npx storybook@latest doctor

Automigrate 脚本

Storybook 升级不是唯一需要考虑的事情:生态系统的变化也带来了挑战。例如,AngularNext.jsSvelte 等知名前端框架一直在对其生态系统进行重大更改,因此即使您不升级 Storybook 版本,也可能需要相应地更新配置。Automigrate 的作用就在于此

npx storybook@latest automigrate

它运行一组标准的配置检查,解释哪些可能已过期,并提供自动为您修复。它还会指向相关文档,以便您可以了解更多信息。它是作为storybook upgrade 命令的一部分自动运行的,但如果您不想升级 Storybook,也可以单独使用它。

预发布版本

除此之外,Storybook 正在不断开发中,我们几乎每天都会发布预发布版本。预发布版本是抢先体验新功能的最佳方式,我们将尽力使其保持稳定,尽管这并非总是可行。

要升级到最新的预发布版本

npx storybook@next upgrade

upgrade 命令将使用您指定的任何版本。例如

  • storybook@next upgrade 将升级到最新的预发布版本
  • storybook@8.0.0-beta.1 upgrade 将升级到 8.0.0-beta.1
  • storybook@8 upgrade 将升级到最新的 8.x 版本

如果您想降级到稳定版本,请手动编辑 package.json 中的包版本号并重新安装。

Storybook 收集完全匿名的数据以帮助我们改善用户体验。参与是自愿的,如果您不想分享任何信息,可以选择退出