在现代 web 开发中,利用 npm 管理依赖并且集成了自动化工具已经成为了不二之选。然而,在利用 npm 管理依赖的同时,我们也会遇到一个问题:如何快速的检查出我们在开发中所修改的代码是否符合规范并且没有产生不可预测的行为?
这个问题看起来很棘手,但是在这里我们要为你介绍的是一个实用的工具包:lint-changed
。lint-changed
可以以最小的精力对刚刚修改的文件进行代码风格和预测行为的检查,从而帮助开发者在最短的时间内快速的修复问题。
安装 lint-changed
lint-changed
是一个 npm 包,你可以利用以下命令进行安装:
npm install --save-dev lint-changed
当然,在使用 lint-changed
前,首先需要保证你的项目中有一个已经选择好的 lint 工具(例如 ESLint,JSLint 等)并且有配置文件。
使用 lint-changed
一旦你已经安装了 lint-changed
并且配置了好你的 lint 工具,那么你就可以在你的项目中使用它了。
为了在项目中使用 lint-changed,你需要在你的 npm script 中添加一个命令:
"scripts": { "lint-changed": "lint-changed" }
这样,当你开始开发一个新的特性或者进行了一些 bug 修复时,你只需要执行 npm run lint-changed
命令。
这个命令会自动的检查出你所修改的文件,并且仅仅针对这些文件运行 lint 工具的检查,从而节省了大量的时间和精力。
更深入的使用
lint-changed
除了仅仅运行 lint 工具的基本功能外,它还有很多值得探究的深入使用方式。
指定要检查的文件类型
有时候,在项目的开发中,你可能会使用到一些非常流行但是却非常棘手的文件类型。比如,在 React 项目中,你可能会使用到 JSX 文件。
为了让 lint-changed
可以支持这些特殊的文件类型,你可以在你的 npm script 中添加一个选项。例如,在你的 package.json
文件中添加以下配置:
"scripts": { "lint-changed": "lint-changed --ext=js,jsx" }
这会为 lint-changed
提供了一个额外的选项,让它可以检查以 .js
或者 .jsx
结尾的文件。
聪明的 commit message
还有一种更为聪明的使用方式,那就是在你的 commit message 中添加一个 [lint]
的标记,这样 lint-changed
就可以自动的检查出你所修改的文件并进行修正。
在你的 .git/hooks/pre-commit
钩子函数中添加以下代码:
#!/bin/bash if git diff --cached --name-only | grep -q '\.js$'; then npm run lint-changed if [ $? -ne 0 ]; then exit 1; fi fi
这段代码会检查出你的修改中所有以 .js
结尾的文件并调用 lint-changed
来对这些文件进行检查。
总结
在本文中,我们介绍了一个非常实用的 npm 包 lint-changed
。作为一个实用的工具包,lint-changed
很好的处理了代码规范和预测性行为的问题,让开发者可以专注于开发而不是规范的问题上。
除了基本的使用方法外,我们还介绍了一些更深入的使用方式,例如指定检查的文件类型和聪明的 commit message。
希望这篇文章能够帮助你更好的规范你的代码并且提高开发效率。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6005598781e8991b448d71dd