06月23, 2016

pre-commit的一些事

今天在掘金看到一篇文章,标题为在git提交前跑npm scripts,看完之后,当时就有一种想立马实施的过程。无奈手上有项目要做,于是就拖到了晚上。

用处

其实这玩意适用于团队,有些人可能编辑器用sublime text,然后没装js或者css相关插件,文件改好之后,可能觉得自己很有信心,就直接git push上去了,那么结果就容易导致别人把代码更新下来后,大骂:你娘的。。

一些误区

不要觉得我下面举的例子是一个语法检查的功能,就觉得这个没啥卵用啊。。它的作用是在git commit之前检查你自定义的任务集,当某个任务抛出错误时,那么git commit失败。

我们可以脑洞大开一下,比如我N久之前的公司要求文件不能外链其他网站的,那么我们可以做一个插件,或者怎样,分析HTML的js/css/img的link地址,如果有外链了其他网站,那么在提交的时候,直接不让提交。

怎么玩

很简单,创建一个项目文件,比如说test,在它下面新建package.json

偷懒一下:

npm init -y

然后把eslint和pre-commit的npm包给装上:(需注意,以下写法为npm3,和npm2的--save-dev相同)

npm i eslint -D
npm i pre-commit -D

当然你们可以把两条命令合二为一,反正怎么开心怎么玩

eslint

这个玩意,MS是今年刚出来的一个标准,结合了js和css。

我不会在此篇文章里面说怎么玩这个,因为我也不是太懂。于是大概查了一些资料。

在根目录下创建.eslintrc(这里说一下很多配置都是rc结尾,不知道含义是不是资源配置的意思)

然后给它加下如下配置:(应该是最最简单的)

{
    "env": {
        "browser": true,
        "node": true,
    },
    "rules": {
        "comma-dangle": [2, "never"]
    }
}

这条规则是指:数组和对象键值对最后一个逗号,never参数:不能带末尾的逗号。

在根目录下新建一个js文件

比如a.js:

var a = {
    a: 1,
    b: 2,
}

最后一对显式地加上逗号。

package.json

{
  "name": "myTest",
  "version": "1.0.0",
  "description": "",
  "main": "",
  "scripts": {
    "lint": "./node_modules/.bin/eslint ./"
  },
  "pre-commit": ["lint"],
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "eslint": "^2.13.1",
    "pre-commit": "^1.1.3"
  }
}

需要说明的是pre-commit这个key对应的数组,必须为scripts里面的key值的组合。

结果

git add .

轻松过关。

Next...

git commit -m "你TM让我提交不"

oh,no...

无法提交

其他

因为一个同事说,无法在window下完成操作,所以就在虚拟机里面的window下面操作了一下,如果大家有问题,可以给我留言。

另外,想问一下,package.json下的scripts里面有&&的写法,是不是在window下无法执行,如:

"scripts": {
    "start": "npm -v && node -v"
  },

运行npm start,看看能不能正常输出。我电脑是OK的,但另外一个同事,两个命令写在一起,中间用&&隔开会报错,但分开执行就正常,真是日了狗了。

本文链接:www.my-fe.pub/post/git-pre-commit.html

-- EOF --

Comments

评论加载中...

注:如果长时间无法加载,请针对 disq.us | disquscdn.com | disqus.com 启用代理。