简介
在开发的过程中，我们需要进行代码检查、格式化、测试等操作。ci-run-staged 是一款能够帮助我们在 Git 提交的时候自动执行预定义的操作的工具，它能够自动运行通过 Git 暂存的代码，并且只会运行被修改的文件。
在本文中，我们将介绍如何使用 ci-run-staged 实现自动化的代码检查、格式化、测试等操作。
安装和使用
ci-run-staged 可以通过 npm 安装：
npm install ci-run-staged --save-dev
然后，在 package.json 文件中定义 npm scripts，如下所示：
{
"scripts": {
"test": "mocha",
"lint": "eslint --cache --format=pretty src test",
"ci": "ci-run-staged --config=.ci-run-staged.json"
}
}其中，各个命令的含义如下：
- test：运行测试用例
- lint：执行代码检查和格式化
- ci：运行 ci-run-staged 工具
然后，在项目的根目录下创建 .ci-run-staged.json 配置文件，配置如下：
-- -------------------- ---- -------
-
-------- -
--------------
--------------
--
----------- -
---- --- ------
---- --- -----
-
-其中，files 属性用来指定需要监控的文件，**/*.js 表示监控所有的 .js 文件。commands 属性用来指定需要执行的命令。
执行 commit 操作时，ci-run-staged 会自动运行以及修改的 .js 文件，并执行 npm run ci 命令。如果满足任意一个文件被修改，那么 commands 中定义的命令都会执行。
如果有多个命令需要运行，可以在 commands 数组中定义多个命令，如上所示。
深入理解
ci-run-staged 的原理是使用 Git Hook 实现的。在执行 Git 提交的时候，Git 会自动运行预定义的钩子脚本，我们可以自定义这些脚本来实现自动化的操作。
ci-run-staged 使用 Git Hook 实现代码检查、格式化、测试等操作，其实现原理如下：
- 在 .git/hooks 目录下创建 pre-commit 钩子脚本，定义执行 ci-run-staged 的逻辑：
-- -------------------- ---- ------- ----------- -- ------- -- ------------- ---------- ----- ---- ---- -------- ----------------- ------------- ---------------------------- ---- -- ---- ---- -------------- --- ------ ------ ------- -- ---- ---- ------- ---------------- ---- - --
- 在 Git 提交时，Git 会自动运行 pre-commit 钩子脚本，它将会运行 ci-run-staged 工具。
通过以上操作，我们就可以在 Git 提交的时候自动执行预定义的操作，如代码检查、格式化、测试等。
示例代码
以一个简单的示例项目为例，展示如何使用 ci-run-staged 实现自动化的代码检查、格式化、测试等操作。
- 创建一个空的项目，并安装 ci-run-staged：
mkdir test-project cd test-project npm install ci-run-staged --save-dev
- 初始化项目，使用 eslint 和 mocha 检查代码和运行测试：
npm init -y npm install eslint --save-dev npm install mocha --save-dev
- 创建测试文件 test/test.js，内容如下：
-- -------------------- ---- -------
----- ------ - ------------------
----------------- ---------- -
---------------------- ---------- -
---------- ------ -- ---- --- ----- -- --- --------- ---------- -
---------------- -- -------------- ----
---
---
---- 创建源代码文件 src/index.js，内容如下：
function add(a, b) {
return a + b;
}
module.exports = { add };- 创建 .eslintrc.json 文件，内容如下：
{
"extends": "eslint:recommended",
"rules": {
"semi": "error"
}
}- 在 package.json 文件中定义 npm scripts 和 ci-run-staged 配置，内容如下：
-- -------------------- ---- -------
-
------- ---------------
---------- --------
-------------- ---
------- -----------
---------- -
------- --------
------- ------- ------- --------------- --- ------
----- -------------- -----------------------------
--
----------- ---
--------- ---
---------- ------
------------------ -
---------------- ---------
--------- ----------
-------- --------
-
-- 创建 .ci-run-staged.json 配置文件，内容如下：
-- -------------------- ---- -------
-
-------- -
--------------
--------------
--
----------- -
---- --- ------
---- --- -----
-
-- 修改 src/index.js 文件，加入语法错误：
function add(a, b) {
return a + b
}
module.exports = { add };- 提交代码，观察 ci-run-staged 的执行情况：
git init git add . git commit -m "Initial commit"
- 修改 src/index.js 文件中的语法错误，并提交代码：
git add . git commit -m "Fix syntax error"
运行结果如下：
从运行结果可以看出，ci-run-staged 自动执行了 eslint 和 mocha，以及只运行被修改的文件。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600668e3d9381d61a3540a72