首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

约束你的git操作,让你生无可恋

用Node构建工具来约束你的git操作,让你生无可恋。

一、前言

今天看到小伙伴写的《你可能会忽略的git提交规范》,不禁想起自己那些不忍直视的提交信息,当然也不能怪自己,谁叫我能够随意的commit呢?上述文章中已经介绍了一些相关的工具以及规范,这里我再补充一些操作,以下内容算是一个简单的教程吧。

二、ESLint

既然要规范起来,当然要从最基本的JS代码规范开始,这里我们选择eslint作为代码规范检测工具。

1、安装ESLint

2、设置配置文件

在根目录下创建.eslintrc.js文件,里面的配置比较的多,对于不同环境的配置也不太一样,可以查看官网文档,这里我们就简单配置一下普通JS文件的检测:

3、验证代码质量与规范

我们可以创建一个app.js文件,输入一些内容,然后通过以下命令执行验证:

如果你的代码不符合要求,那么控制台并会提示你哪些地方存在问题。

其实对于eslint大家再熟悉不过了,各种项目的脚手架工具里都通过webpack集成了它的功能,所以当你在执行npm run dev,如果代码不符合eslint的规范,你是不能够完成dev构建的。

但是有时候吧,烦不了,直接git add保存一下再说。现在我知道,这并不是一个好习惯,所以要改。

三、Husky和lint-staged

对的,你没看错,是Husky(哈士奇)。正如Husky官方文档中所说,

Git hooks made easy

对于这个hook这个词类比一下Vue中的生命周期,你就知道咋回事了。所以接下来,我们只需要通过这个库,就可以在git add 之前做一些不可描述的事了(所以你再仔细回味一下这个名字,是不是很皮)。

有了这个还不够,我们还需要lint-staged,它的作用文档中描述的也很清楚:

Run linters on git staged files

1、安装依赖

2、配置package.json

接下来,再也不能那么随意的执行git的add操作了。

四、validate-commit-msg

对于这个库的使用,前面所说的文章中已经介绍的很详细了,包括提供的一些Angular commit规范的参考文章。这里我们同样需要在husky中配置一下:

到这里基本上一个小型的代码规范化提交工作流程完成了。

五、生成日志

当然,你如果看过一些开源项目,在他们的项目中都有一个CHNAGELOG.md文件,这个文件主要是用来记录项目更新迭代的信息。这里我们可以采用conventional-changelog来生成日志文件:

1、安装依赖

2、配置package.json

接下来你可以通过npm run changelog生成完整的日志,前提是你的提交要符合Angular Commit标准。

六、写在结尾

这里只是简单的介绍了两种强制验证的情况,实际上我们也可以在pre-commit中加入csslint,当然肯定还有更多的例子,欢迎小伙伴们分享自己的惨痛经历。

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20180711G03GL100?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券