Storybook XState 插件

灵感来自 storybook-xstate-addon 但无需依赖 xstate/react 即可支持 Web Components Storybook

开发脚本

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

从 TypeScript 切换到 JavaScript

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

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

发布管理

设置

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

• NPM_TOKEN 创建具有 Read and Publish 权限的令牌。
• GH_TOKEN 创建具有 repo 范围的令牌。

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

• 名称
• 作者
• 仓库

本地

要在本地使用 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，以便在任何人推送到你的仓库时自动发布你的插件。

前往 Settings > Secrets，点击 New repository secret，然后添加你的 NPM_TOKEN。

创建发布

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

yarn release

这将

• 构建并打包插件代码
• 提升版本
• 推送到 GitHub 和 npm
• 将更新日志推送到 GitHub