在多人合作的項目團隊中,根據開發規范,統一代碼風格,是打造一支規范化技術團隊必不可少的一部分。
在一個npm項目中,我們常用ESLint來做代碼檢查:
- 項目根目錄下創建ESLint配置文件
# 項目
cd project
touch .eslintrc.js
根據ESLlint規則在.eslintrc.js
文件中創建代碼校驗規則。
- 創建npm校驗腳本
vi package.json
# 在scripts中新增一行
scripts: {
"lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
},
這樣,就可以通過npm run lint
來按照配置的ESLint規則檢測代碼的規范性。
- 利用
Git pre-commint
鉤子實現強制校驗
團隊中人員水平和意識參差不齊,某些同事在客觀和主觀上會或多或少地疏漏代碼校驗這個環節。那么,如何去強制校驗呢?
設想下,如果在代碼提交時觸發代碼校驗腳本,不通過則不能提交,不就實現了強制校驗了嗎?
Git 能在特定的重要動作發生時觸發自定義腳本,詳情見Git hooks。在這里,我們要在提交前檢查其代碼快照,所以采用pre-commit hooks
。
如果你是一位精通shell腳本的大神,可以直接去修改Git pre-commit hooks
的源文件:
cd .git/hooks
ls
# applypatch-msg.sample post-commit.simple pre-commit.simple ...
以.simple
擴展名結尾的文件都是Git提供的示例。如果想讓他們生效,需要移除`.simple
# 復制 pre-commit.simple 文件并去掉擴展名
cp pre-commit.simple pre-commit
# 寫入你要執行的腳本
vi pre-commit
# xxx... 此處省略大神shell腳本,感興趣的可以去 Google
同時,為了兼容快發人員快捷提交命令git commit -am"xxx"
,還需要在pre-applypatch
這個鉤子下去做相同的配置。
大多數碼農朋友對于shell
腳本不是很精通,寫起來也費時費力。這里推薦使用 husky,通過配置npm
腳本,來自動生成pre-commit文件
。
npm i husky -D
# 在package.json 的 scripts中繼續新增一行
scripts: {
"lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
"precommit": "npm run lint"
},
打開.git/hooks
目錄,發現生成了pre-commit
文件。
自此,每次執行git commit -m 'xxx'
操作,就會觸發npm run lint
。若鉤子返回結果為false,則無法提交,修改代碼直至通過校驗后,方可提交通過。