1. 程式人生 > >更優雅的使用Git

更優雅的使用Git

JavaScript之禪已經發過兩篇 Git 相關的文章了。一篇文章,教你學會Git :淺顯易懂,如果你還不會 Git 可以先去看看、Git的奇技淫巧 :介紹了一些實用的操作。今天為大家帶來第三篇,如何更優雅的使用 Git

寫好 commit message

Git 每次提交程式碼,都要寫 Commit message,否則提交不了。我們不光得寫 Commit message 而且還應該寫的清晰明瞭,說明本次提交的目的。

  1. $ git commit -m "提交資訊"

在編輯器中寫commit message

  1. $ git commit

寫好 Commit message 好處多多:

1、統一團隊Git commit 日誌風格

2、方便日後 Reviewing Code

3、幫助我們寫好 Changelog

4、能很好的提升專案整體質量

Commit 提交規範

業界比較推崇 Angular 的 commit 規範 http://suo.im/4rsYee

Commit message 包括三個部分:Header,Body 和 Footer。完整格式如下:

  1. <type>(<scope>): <subject>

  2. <BLANK LINE>

  3. <body>

  4. <BLANK LINE>

  5. <footer>

1) type

提交 commit 的型別,包括以下幾種

- feat: 新功能

- fix: 修復問題

- docs: 修改文件

- style: 修改程式碼格式,不影響程式碼邏輯

- refactor: 重構程式碼,理論上不影響現有功能

- perf: 提升效能

- test: 增加修改測試用例

- chore: 修改工具相關(包括但不限於文件、程式碼生成等)

2) scope

修改檔案的範圍,比如:檢視層、控制層、docs、config, plugin

3) subject

- subject 是 commit 目的的簡短描述(用一句話清楚的描述這次提交做了什麼),不超過50個字元

4) body

- 補充 subject 新增詳細說明,可以分成多行,適當增加原因、目的等相關因素,也可不寫

5 ) footer

- 當有非相容修改(Breaking Change)時必須在這裡描述清楚

- 關閉issue或是連結到相關文件,如 Closes #1, Closes #2, #3

使用 commitzen

commitzen 這個工具可以幫助我們寫出規範的 Commit message。

GitHub:https://github.com/commitizen/cz-cli

 

使用npm 全域性安裝

  1. $ npm install -g commitizen

在專案中使用 angular 的 commit 規範

  1. $ commitizen init cz-conventional-changelog --save-dev --save-exact

然後我們就可以愉快的使用 git cz 代替 git commit 命令了。當然我們也可也將其加到npm script 中

  1. "script": {

  2.    "commit": "git cz"

  3. }

然後直接使用npm run commit

使用 gitmoji

gitmoji 和 commitzen的作用都是幫助我們寫出規範的commit message,不過gitmoji有更好玩的 moji表情。( 用moji來表示type )

GitHub:https://github.com/carloscuesta/gitmoji-cli

安裝使用

  1. # 安裝

  2. $ npm i -g gitmoji-cli

  3. # 使用

  4. $ gitmoji -c

挑選個符合場景的moji 提交本次更改

 

使用Git hooks

與其他版本控制系統一樣,當某些重要事件發生時,Git 可以呼叫自定義指令碼,Git 有很多鉤子可以用來呼叫指令碼自定義 Git。在 .git -> hooks 目錄下可以看到示例。 例如:pre-commit就是在程式碼提交之前做些事情。如果你打開了 hooks 目錄裡面的 *.sample 檔案,你可以看見裡面寫的shell指令碼。但是我想用 Js 寫 hooks 咋辦?husky、pre-commit就能滿足你。

現在我們想實現一個提交程式碼時使用 Eslint 進行程式碼檢查的功能

先來看pre-commit

GitHub:https://github.com/observing/pre-commit

  1. # 下載安裝

  2. $ npm install --save-dev pre-commit

在package.json 中配置pre-commit

  1. "scripts": {    

  2.   "lint": "eslint [options] [file|dir|glob]*",

  3. },

  4. "pre-commit": [    

  5.   "lint",

  6. ]

現在提交程式碼試試

  1. $ git commit -m 'Keep calm and commit'

再試試 husky

GitHub:https://github.com/typicode/husky

開始還是下載,不過這兒我們用的是 @next 版,使用方法與正式版略有不同。

  1. $ npm install [email protected] --save-dev

和 pre-commit 一樣,還是在package.json中配置。但是處理pre-commit鉤子它還可以做的更多。

  1. // package.json

  2. {

  3.  "scripts": {

  4.    "lint": "eslint [options] [file|dir|glob]*",

  5.  },

  6.  "husky": {

  7.    "hooks": {

  8.      "pre-commit": "npm lint",

  9.      "pre-push": "..."

  10.    }

  11.  }

  12. }

本文介紹瞭如何規範的編寫Commit message,以及使用commit zen與gitmoji這兩個工具來幫助我們寫出規範的Commit message。最後介紹了下Git hooks,並通過 husky 或是 pre-commit 與 Eslint結合使用來構建一個程式碼檢測工作流。當然,你還可以做的更多。

本文完.