npm 包 @marionebl/conventional-changelog-cli 使用教程

前言

前端领域的技术日新月异,一个好的项目需要良好的规范和文档,而 changelog 就是其中非常重要的一部分。@marionebl 出品的 npm 包 conventional-changelog-cli 可以根据规范自动生成 changelog,大大提高了文档生成的效率和准确度,本文就会详细介绍该包的使用以及如何配置规范。

什么是 changelog

Changelog 又称版本记录,是一种文档格式,可以记录一个软件或者项目的版本变更情况。通常包含以下信息:

  1. 版本号:可以是数字、字母或者其他自定义形式。
  2. 发布日期:记录该版本的发布日期。
  3. 变更内容:包含新增功能、修改、删除功能或者有关安全或者性能的调整等。
  4. 安装说明:详细说明该版本如何安装和部署。

什么是 conventional commit 规范

Conventional commit 规范是一种规范化的 commit message 内容格式。它有利于自动化生成 changelog、自动化版本发布、自动化语义化版本控制等。在 Conventional commit 规范中,每个 commit message 都由三部分组成:type、scope 和 subject。

其中,type 为 commit 的类型,常见的有以下七种:feat、fix、docs、style、refactor、test 和 chore。具体解释如下:

  • feat:新功能
  • fix:修复 bug
  • docs:仅仅修改了文档,比如 README、CHANGELOG、CONTRIBUTE 等等
  • style:修改了空格、格式、缺少分号等,适用于不影响代码功能的情况
  • refactor:重构(即不是新增功能,也不是修改 bug 的代码变动)
  • test:新增、修改测试用例
  • chore:构建过程或者辅助工具的变动

scope 是可选项,用来说明该 commit 的影响范围。subject 是 commit 的简短描述。

比如:

------------- ------------------ - ------------ -------

如何使用 @marionebl/conventional-changelog-cli

安装

-- --- --- -----
--- ------- -- --------------------------

-- --- --- -----
--- ------- -- -------------------------- ----------

使用

-- ----- ---------
---------------------- -- ------- -- ------------

-- ------- ---------
---------------------- -- ------- -- ------------ --------------- -

参数说明:

  • -p:指定使用的 commit 规范,angular 为一个非常流行的规范,你也可以使用其他规范。
  • -i:指定需要写入 changelog 的输出文件,在这里我们指定 CHANGELOG.md 文件。
  • --release-count:指定需要生成 changelog 的版本数,这里我们指定为 0,表示生成最近的 changelog。

配置 conventional commit 规范

在使用 conventional-changelog-cli 进行 changelog 生成之前,需要先设置规范。

  1. 安装必要的依赖:
--- ------- ---------- -----
--- ------- ---------- --------------- -------------------------------
  1. package.json 中添加以下配置:
-------- -
  -------- -
    ------------- ----------- -- ------------
  -
--
------------- -
  ---------- -----------------------------------
-

这里,我们使用了 husky 将需要使用的 commitlint 钩子自动挂载,同时配置使用 @commitlint/config-conventional 规范。

  1. 安装 VSCode 插件及其依赖

  2. 继续编辑 .vscode/settings.json 添加以下代码

----------- ------------ --------------------------
------------------------- -----

示例代码

-- --
--- ------- -- --------------------------

-- ----- ---------
---------------------- -- ------- -- ------------

结语

通过本文的介绍和示例代码,相信大家已经掌握了 @marionebl/conventional-changelog-cli 的使用方法和规范设置,更多详细用法请参照官方文档。规范的 commit message 对于团队协作和项目管理极为重要,希望本篇文章能够对大家有所帮助。

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/60066bca967216659e244623


猜你喜欢

  • npm 包 @navelpluisje/np-knob 使用教程

    在前端开发中,轮盘组件是一个广泛应用于各种类型的应用中的UI元素。npm 包 @navelpluisje/np-knob 就是一个优秀的轮盘组件,它具有自定义定义的能力,并且兼容所有主流浏览器。

    4 年前
  • npm 包 @next/gh-issues 使用教程

    如果你是一个前端工程师,你一定会经常遇到和 GitHub Issues 相关的工作。但是,如果你想把一个简单的 GitHub Issue 迁移到你的网站上,这会变得比较困难。

    4 年前
  • NPM包 @nextindex/next-scss使用教程

    在前端开发中,通常使用SCSS来创建CSS样式。但是,每次都从头开始写SCSS文件并不是一个明智的选择。这时,@nextindex/next-scss便会显得尤为有用。

    4 年前
  • npm 包 @next/gh-labels 使用教程

    介绍 在开发过程中,经常需要为 Github 仓库添加标签。手动添加不仅费事费力,而且会出现人为失误,因此我们需要一个自动添加标签的工具。@next/gh-labels 是一款强大的 npm 包,它可...

    4 年前
  • npm 包 @nextindex/vue-simple-accordion 使用教程

    简介 在前端开发中,收缩面板(Accordion)是非常常见的展现方式。@nextindex/vue-simple-accordion 是一个简单易用的 Vue.js 组件,提供了可定制的收缩面板展现...

    4 年前
  • npm 包 @ng-playground/generator-ng-lib 使用教程

    什么是 npm 包? npm (Node Package Manager) 是 Node.js 的包管理器,可以通过 npm 安装、发布和管理 Node.js 模块。

    4 年前
  • npm 包 @ng-validators/ng-validators 使用教程

    前言 @ng-validators/ng-validators 是一个 npm 包,可以用于 Angular 应用程序的表单验证。本文将介绍如何使用此 npm 包,并提供一些示例代码和指导意义以帮助你...

    4 年前
  • npm 包 @ng-wordpress/api 使用教程

    简介 @ng-wordpress/api 是一个基于 Angular 和 WordPress REST API 的 npm 包。它提供了一系列服务和组件,使得开发者可以更方便地使用 WordPress...

    4 年前
  • npm包@ng2-dynamic-forms/core使用教程

    前言 在前端开发中,创建表单是一项基本技能。然而,如果需要同时创建多个表单,或者需要动态地在用户交互时创建表单,则需要使用动态表单。此时,@ng2-dynamic-forms/core是一款非常好用的...

    4 年前
  • npm 包 @ng2-dynamic-forms/ui-basic 使用教程

    在现代 Web 开发中,动态表单是一个很常见的需求。为了方便开发人员快速搭建动态表单,有很多优秀的表单构建工具和库。其中,@ng2-dynamic-forms/ui-basic 是一个非常值得推荐的 ...

    4 年前
  • npm 包 @ng2-dynamic-forms/ui-bootstrap 使用教程

    在前端开发中,我们常常需要使用表单来收集用户数据或进行搜索等操作。但是手动构建表单的过程复杂而枯燥,并且会导致代码的重复。这时候,我们可以使用 @ng2-dynamic-forms/ui-bootst...

    4 年前
  • npm 包 @ng2-dynamic-forms/ui-foundation 使用教程

    随着前端技术的不断发展,表单始终是网站或应用程序不可或缺的组成部分之一。@ng2-dynamic-forms/ui-foundation 是一个非常有用的 npm 包,可以轻松地创建动态表单,本文将详...

    4 年前
  • npm 包 @ng2-dynamic-forms/ui-kendo 使用教程

    前言 在前端开发过程中,我们经常需要为应用程序添加动态表单功能。针对 Angular 应用,我们可以使用 npm 包 @ng2-dynamic-forms/ui-kendo 来实现动态表单功能。

    4 年前
  • npm 包 @ng2felix/config 使用教程

    前言 在前端开发中,我们经常需要编写一些配置文件,比如环境配置、接口地址配置等等。而这些配置文件通常会带来以下一些问题: 配置文件的修改和更新不方便 不同环境的配置文件差异化管理比较麻烦 多人协作时...

    4 年前
  • npm 包 @nglogger/core 使用教程

    大家好,今天我们要介绍的是一个前端技术相关的 npm 包,@nglogger/core。 1. 什么是 @nglogger/core? @nglogger/core 是一个 Angular 日志记录...

    4 年前
  • npm 包 @ng2-dynamic-forms/ui-material 使用教程

    简介 在前端开发中,表单是经常使用的元素之一。@ng2-dynamic-forms/ui-material 是一个基于 Angular Material 开发的动态表单库,使用它可以快速实现各种表单需...

    4 年前
  • npm 包 @nas-user/glob-loader 使用教程

    前言 在前端开发中,我们经常需要进行文件打包和处理。Webpack 是一款强大的打包工具,但是仅仅只有 Webpack 并不能完成所有的任务。在 Webpack 中,我们经常需要使用 Loader 对...

    4 年前
  • npm 包 @ngat/createpk 使用教程

    概述 前端开发中经常需要使用 npm 包来管理项目依赖和进行构建。@ngat/createpk 是一个 npm 包,它可以帮助我们快速创建一个基于 Vue.js 和 Element UI 的前端项目。

    4 年前
  • npm 包 @ng2-dynamic-forms/ui-primeng 使用教程

    前言 在前端开发中,表单是一个非常重要的组件。表单组件的设计和实现需要考虑到数据上的验证、处理以及视觉上的美观和易用性等方面,尤其是在 Angular 框架中,表单的处理更是一个需要细致思考和规划的问...

    4 年前
  • npm 包 @ng2felix/storage 使用教程

    在前端开发中,使用本地存储是非常常见的操作,通过使用 LocalStorage API,我们可以在客户端浏览器中存储数据。不过,LocalStorage API 的使用过程中会有一些繁琐的步骤,例如序...

    4 年前

相关推荐

    暂无文章