在前端开发中，我们通常使用 Git 来管理代码，而在 Git 中，提交信息是非常重要的。它可以帮助我们更好地了解这个提交的目的、修改的范围以及如何测试这个修改。因此，我们需要一个良好的提交信息规范，这样可以让项目维护更清晰，也可以帮助其他开发者更好地了解同一个项目的情况。
在本文中，我们将介绍一个非常流行的提交信息规范套件：conventional-changelog-esdoc。本文将介绍如何安装和使用它，并且一步步跟随示例代码进行操作。
什么是 conventional-changelog-esdoc
conventional-changelog-esdoc 是一个使用了 Commitizen 和 Husky 的提交信息规范套装，用于生成能够在各个项目上使用的统一的 changelog。它可以帮助你在提交代码时遵循 Angular 规范的提交信息格式。
安装 conventional-changelog-esdoc
在使用 conventional-changelog-esdoc 之前，我们需要先安装它。可以使用下面的命令进行安装：
npm install -g conventional-changelog-esdoc
安装完成后，我们需要在我们需要使用这个规范套件的项目中进行配置。
配置 conventional-changelog-esdoc
安装完成后，我们需要对项目进行配置。我们首先需要在项目中安装一些依赖：
npm install --save-dev commitizen conventional-changelog-conventionalcommits husky
这些依赖包括：
- commitizen：使用 Git 风格的交互式命令行，来创建格式化的 Git 提交信息。
- conventional-changelog-conventionalcommits：基于 Commitizen 交互式命令行过程的提交信息工具，提供了常见的 Angular 提交信息格式。
- husky：Git Hooks，用于在 git commit 时运行命令。
安装完成后，我们需要在项目的 package.json 文件中添加如下配置：
-- -------------------- ---- -------
-
------------------ -
------------- ---------
--------------------------------------------- ---------
-------- ---------
--
--------- -
------------- -
------- ----------------------------------------
-
--
-------- -
-------- -
------------- ----------- -- -----------------
-
-
-在这个配置中，我们定义了 commitizen 的路径，husky 的测量钩子还有如何用 commitlint 钩子来运行 husky。
接下来，我们需要配置一下 Commitizen 和 conventional-changelog-conventionalcommits：
npx commitizen init cz-conventional-changelog --save-dev --save-exact
运行命令后，会提示我们一些问题，例如：提示用户在什么情况下提交代码，是否具有 Breaking changes 等等。运行此命令后，我们就成功地完成了 conventional-changelog-esdoc 的配置和安装。
使用 conventional-changelog-esdoc
现在，我们已经完成了 conventional-changelog-esdoc 的安装和配置，接下来就可以开始使用它了。当你输入 git commit 命令时，会自动运行 commitizen，用于提示使用者输入清晰的提交信息。
git commit
当键入以上命令时，将看到类似以下内容的页面：
-- -------------------- ---- ------- - ------ --- ---- -- ------ ---- ------ ----------- ---- ----- ----- - ----- - --- ------- ---- - --- --- ----- ------------- ---- ------- ------ ------- ---- -- --- ------ --- ------- -- --- ---- ------------- ----------- ------- ------------ ---- --------- - ---- ------ ---- ------- ----- - --- --- ---- - ------- ----- - ---- ------ ---- -------- ----------- ----- ------ ------- ----- -- ---------- -------- ----- ------ ------- ---- ------ --- ----- ------ -- -------- ------------ -------- ------- ----- --------- ---- --- ------- -- --- -- ------------- ----- --- ------- -------- ------- ------- ------- ------------- ---------- ------ ----- ------- ---- ----- ------ --- -- ---- -----
从上面的列表中选择一项，并进入下一步：
? Select the type of change that you're committing: feat: A new feature ? What is the scope of this change (e.g. component or file name)? (press enter to skip) (empty) ? Write a short, imperative tense description of the change (max 84 chars): (65) Add foo feature ? Provide a longer description of the change: (press enter to skip) (empty) ? Are there any breaking changes? No ? Does this change affect any open issues? No
在输入清晰的提交信息后，commitizen 将自动为我们生成符合规范的提交信息。我们可以看到每个提交的范围、类型、描述和更改。这对于团队开发和维护项目非常重要。
总结
现在，你已经掌握了如何使用 npm 包 conventional-changelog-esdoc。它可以帮助你在不同的项目中统一提交信息规范和生成易于阅读的 changelog。通过本文的学习和实践，你可以更好地管理和维护自己参与的前端项目。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055c2b81e8991b448d9ca1