使用 dumi 创建组件库(下)
2024-02-21 12:20:49
在 使用 dumi 创建组件库(上) 一文中,我们介绍了 dumi 的基本使用、如何使用 lerna 管理多个包,以及如何使用 prettier 和 eslint 配置代码风格。本文将继续介绍如何使用 git hooks 和 commitlint 配置提交规范。
git hooks
git hooks 允许我们在特定事件发生时执行自定义脚本。在组件库开发中,我们可以使用 git hooks 来强制执行代码风格、运行测试或生成文档。
要创建 git hook,只需在项目根目录的 .git/hooks
目录中创建文件并赋予它可执行权限即可。例如,要创建一个在提交前运行 prettier 格式化代码的 git hook,我们可以创建 .git/hooks/pre-commit
文件,内容如下:
#!/bin/sh
yarn prettier --write src
commitlint
commitlint 是一个工具,它可以帮助我们强制执行提交消息的格式和内容。这有助于保持提交历史记录的整洁性和可读性。
要使用 commitlint,我们需要安装它:
yarn add --dev @commitlint/cli
然后,我们需要创建一个配置文件 .commitlintrc.js
:
module.exports = {
extends: ['@commitlint/config-conventional'],
rules: {
'type-enum': [
2,
'always',
['feat', 'fix', 'refactor', 'docs', 'style', 'test', 'chore', 'revert'],
],
},
};
此配置文件指定我们希望使用常规提交规范。它还强制要求提交类型为以下之一:feat、fix、refactor、docs、style、test、chore 或 revert。
要使用 commitlint,我们可以运行以下命令:
npx commitlint --edit
这将在编辑器中打开提交消息,commitlint 会根据我们的配置提供反馈。
总结
以上就是使用 dumi 创建组件库时一些有用的技巧和工具。通过使用 lerna、prettier、eslint、git hooks 和 commitlint,我们可以确保代码质量、提交规范性和开发流程的顺畅性。
希望这篇文章对您有所帮助。如果您有任何问题或建议,请随时给我留言。