在团队中,代码风格统一是十分重要的,虽然我们有 eslint[1] 和 stylelint[2] 等工具帮我们检查代码,但总有人以各种理由不检查。不过我们可以在提交代码时使用 git hook 来强制检查。

husky[3] 可以将 eslint 等检查命令,植入到 git hook,让你在提交代码时自动检查代码,但是每次提交代码,我们不是修改了所有代码,所以我们没必要检查所有代码。使用 git 的 staged 特性,我们可以把修改过的文件拿出来,给 eslint 检查,lint-staged[4] 就是这样一个工具。

微信小程序自定义了一套伪 HTML,CSS,JS 语言,虽说后缀不一样,但是内容大差不差,我们可以使用 eslint 和 stylelint 检查。

先看一下 npm script 配置:
npm script

我们先定义了两个 lint-js, lint-css 两个检查脚本,在我们执行 git commit 的时候,git hook 会调用 precommit 中的 lint-staged 命令,把修改过的在缓存区的文件拿出来,交给 lint-js、 lint-css 检查。当检查通过时 commit 成功,检查失败时输出错误,阻止提交。

git commit

这样我们就可以在提交代码的时候,阻止风格不一致的代码了。

如果我们需要检查所有代码,也可以执行 npm run lint-all, 查看所有代码是否能通过检查。


  1. https://github.com/eslint/eslint ↩︎

  2. https://github.com/stylelint/stylelint ↩︎

  3. https://github.com/typicode/husky ↩︎

  4. https://github.com/okonet/lint-staged ↩︎


标签:前端工具git