tslint pre-commit 配置教程

tslint 配合pre-commit的意義

爲何用pre-commit 加 tslint（jshint，eslint原理都相似），由於在項目中咱們會常常忘記主動的去作代碼檢查，雖然結合webpack各類構建工具下，存在*slint報錯，項目會跑不起來。但在某些狀況下，可能會由於着急，或者其餘緣由，沒有去觀察項目運行的狀況就倉促提交。團隊開發的情景下，可能會成爲別人的麻煩。而pre-commit tslint解決的需求既是：拒絕向倉庫提交錯誤代碼。

git hooks

在配置tslint pre commit以前，首先須要瞭解git hooks，正如它的名字所示，這是一個關於git 操做的鉤子，好比咱們想要在作遠程倉庫推送時，那就會觸發pre-push這個鉤子，而後在這個鉤子中寫下本身想作的事。git hooks的配置就在項目.git文件夾下面的hooks文件夾中。

在寫相關的鉤子函數時，須要注意的是，將鉤子後面的sample後綴去掉，代碼纔會生效。

好比，本文中用到的pre-commit這個鉤子。

更多關於git hooks的介紹，請參考：https://git-scm.com/book/en/v...

開始配置

1.打開項目中的.git/hooks文件夾，找到pre-commit.sample文件，將如下代碼替換到文件中。

#!/bin/bash
TSLINT="$(git rev-parse --show-toplevel)/node_modules/.bin/tslint"
for file in $(git diff --cached --name-only | grep -E '\.ts$')
do
        git show ":$file" | "$TSLINT" "$file"
        if [ $? -ne 0 ]; then
                exit 1
        fi
done

2.將pre-commit.sample文件名修改成pre-commit。

此時再打開項目運行git commit -m"xx"命令時，tslint會作自動的檢查，若是沒有錯誤的話，纔會提交成功。而存在tslint報錯的話，會終止提交。

平常開發中，有時爲了方便會直接使用git commit -am"xxx"（即add+commit）的指令。而pre-commit 只是單獨commit 鉤子，所以還須要在pre-applypatch這個鉤子下去作相同的配置。