Storybook 的 XState 插件

灵感来自 storybook-xstate-addon，只是不需要 xstate/react 就可以支持 web 组件 storybook

开发脚本

• yarn start 在观察模式下运行 babel 并启动 Storybook
• yarn build 构建和打包你的插件代码

从 TypeScript 切换到 JavaScript

不想使用 TypeScript？我们提供了一个方便的弹出命令：yarn eject-ts

这将把所有代码转换为 JS。这是一个破坏性的过程，因此建议你在开始编写任何代码之前运行它。

发布管理

设置

此项目配置为使用 auto 进行发布管理。它会生成变更日志并将其推送到 GitHub 和 npm。因此，你需要配置对这两者的访问权限

• NPM_TOKEN 创建一个具有读取和发布权限的令牌。
• GH_TOKEN 创建一个具有repo范围的令牌。

然后打开你的package.json并编辑以下字段

• name
• author
• repository

本地

要在本地使用auto，在你的项目的根目录创建一个.env文件并将你的令牌添加到其中

GH_TOKEN=<value you just got from GitHub>
NPM_TOKEN=<value you just got from npm>

最后，在 GitHub 上创建标签。你将在以后修改包时使用这些标签。

npx auto create-labels

如果你在 GitHub 上查看，现在会看到一组auto希望你使用的标签。使用这些标签来标记未来的拉取请求。

GitHub Actions

此模板已经预先设置了 GitHub actions，可以在任何人推送到你的仓库时发布你的插件。

转到设置 > 密钥，点击新建仓库密钥，添加你的NPM_TOKEN。

创建发布

要在本地创建发布，你可以运行以下命令，否则 GitHub action 将为你进行发布。

yarn release

这将

• 构建和打包插件代码
• 更新版本号
• 将发布推送到 GitHub 和 npm
• 将变更日志推送到 GitHub