<style>
html, body, .ui-content {
background-color: #333;
color: #ddd;
}

.markdown-body h1,
.markdown-body h2,
.markdown-body h3,
.markdown-body h4,
.markdown-body h5,
.markdown-body h6 {
color: #ddd;
}

.markdown-body h1,
.markdown-body h2 {
border-bottom-color: #ffffff69;
}

.markdown-body h1 .octicon-link,
.markdown-body h2 .octicon-link,
.markdown-body h3 .octicon-link,
.markdown-body h4 .octicon-link,
.markdown-body h5 .octicon-link,
.markdown-body h6 .octicon-link {
color: #fff;
}

.markdown-body img {
background-color: transparent;
}

.ui-toc-dropdown .nav>.active:focus>a, .ui-toc-dropdown .nav>.active:hover>a, .ui-toc-dropdown .nav>.active>a {
color: white;
border-left: 2px solid white;
}

.expand-toggle:hover,
.expand-toggle:focus,
.back-to-top:hover,
.back-to-top:focus,
.go-to-bottom:hover,
.go-to-bottom:focus {
color: white;
}

.ui-toc-dropdown {
background-color: #333;
}

.ui-toc-label.btn {
background-color: #191919;
color: white;
}

.ui-toc-dropdown .nav>li>a:focus,
.ui-toc-dropdown .nav>li>a:hover {
color: white;
border-left: 1px solid white;
}

.markdown-body blockquote {
color: #bcbcbc;
}

.markdown-body table tr {
background-color: #5f5f5f;
}

.markdown-body table tr:nth-child(2n) {
background-color: #4f4f4f;
}

.markdown-body code,
.markdown-body tt {
color: #eee;
background-color: rgba(230, 230, 230, 0.36);
}

a,
.open-files-container li.selected a {
color: #5EB7E0;
}
</style>
###### tags: `Git` `SeanDev` `commit message`

# 清楚的Commit Message

在做Commit提交時，除了將修改過後的內容提交上去外，還須為這次的commit做內容說明(Message)，記錄提交版本更動的摘要。

良好的message撰寫有以下優點：

1. 個人
- 幫助自己回顧開發紀錄，方便快速瀏覽。(git log)
- 可以過濾某些 commit（比如文檔改動），便於快速查找信息(git log —grep=”提交的訊息文字”)
- 易於暸解Commit的意圖
1. 團隊
- 易於暸解功能添加/修改的前因後果
- 易於追蹤功能的開發狀況
- 有助於Code Review的進行
- 掌握Bug的修改狀況
- 讓其他開發維護人員易於進入狀況
- 向同事、合作夥伴或利益相關者傳達變化的過程。

不良的message撰寫有以下缺點：

1. 個人
- 無法回顧開發紀錄，需耗費時間重新了解程式碼
- 不明的message訊息，容易讓人遺忘Commit的意圖
- 無法掌握及回顧功能的開發狀況，需耗費時間處理或重新來過
1. 團隊
- 不易暸解功能添加/修改的前因後果，需耗費時間了解
- 功能的開發狀況不清楚，需耗費時間確認
- Code Review可能會更花時間
- 其他開發維護人員需花更多時間來暸解

範例 1：

良好的Commit Message

> 新增登入功能畫面
>
>建立帳號、密碼欄位UI
>建立登入按鈕UI
>

不良的Commit Message

> 新增畫面

範例 2：

良好的Commit Message

> 添加小明登入後的權限
>
>小明在登入後希望有A功能
>因此新增特殊權限，讓小明登入時可使用A功能
>記得在Release版時移除
>

不良的Commit Message

> 添加新的權限
>

## 團隊開發 Message Convention 規範

Git Commit Message 格式

<type>[optional scope]: <subject>

[optional body]

[optional footer(s)]

## Type(必填)

本次Commit的類型，若有重大功能調整，在Type後面加上!

- feat: 增加新功能或修改功能
- fix: 修改Bug
- docs: 文件修改或添加程式註解，不影響程式碼。
- style: coding style調整。如:空白、分號、空格、格式縮排等，不影響程式碼。
- refactor: 重構或優化程式碼，不影響程式功能。
- perf: 提升效能的修改。
- test: 新增或修改測試。
- chore: 建構程序或輔助工具的變動，不會修改程式碼和測試，如:環境建置或修改config等。

## Scope(選填)

本次Commit影響的範圍，例如資料庫、Component、Module、Router等等

## Subject(必填)

本次Commit的簡要說明描述。若無法做簡要說明，那可能是這個Commit太過複雜，需要考慮將提交部分內容抽離成另一個Commit。

- 描述內容第1個字詞以動詞為主。
- 描述文字字元不超過50字。
- 若為英文，第一個字母為大寫
- 在type: 空一格在寫Subject

## Body(選填)

本次 commit 的詳細描述，說明程式碼變動的項目與原因。

內容可包含這次Commit前產生的問題(為什麼做這件事？why)、commit做了什麼事(what)、用什麼方法做到(how)。

在使用fix、refactor、perf或feat修改功能時建議寫上詳細內容。

- 內容每 70個字元斷行
- 內容可以多解釋 what and why vs. how

## Footer(選填)

當前 commit 是針對某個 issue時或是pull request 號碼可在此添加

- 填入Issue編號，如#as123

### 範例

feat: 新增登入功能畫面

在login.html裡
建立帳號、密碼欄位UI
建立登入按鈕UI

feat: 添加小明登入後的權限

小明在登入後希望有A功能
因此新增特殊權限，讓小明登入時可使用A功能

在 Login() 裡多一個isSuperMember的判斷

記得在Release版時移除

fix: 修改登入畫面跑版問題

使用手機瀏覽器開啟時，登入按鈕未顯示
因為css裡的content設定所造成

fix: 修正小明登入後可使用A功能的問題

正式版本的情況下，小明登入後不可以使用A功能
除非他升級成VIP會員

在acid189版開發時添加一個特殊權限的管道
在relese版時忘了刪除

移除 Login() 裡的isSuperMember的判斷

### 參考來源

[Conventional Commit](https://www.conventionalcommits.org/en/v1.0.0/)

[AngularJS團隊 Message Convention 規範](https://docs.google.com/document/d/1QrDFcIiPjSLDn3EL15IJygNPiHORgU1_OOAqWjiDU5Y/edit#heading=h.greljkmo14y0)

[Git Log 進階使用](https://blog.csdn.net/ly890700/article/details/52787257)

[Commit訊息的重要性](https://docs.google.com/presentation/d/e/2PACX-1vRI5E0g1mDyXPcSuMG9nZ_XpBmnkk3SmloLt2Z5-ArEjFAM-GBtz9FXCT4Pxw0fq7hdbf0cId22DwxZ/pub?start=false&loop=false&delayms=60000&slide=id.g57075cf75d_0_151)

[如何寫一個Git Commit Message](https://blog.louie.lu/2017/03/21/%E5%A6%82%E4%BD%95%E5%AF%AB%E4%B8%80%E5%80%8B-git-commit-message/)

### 延伸閱讀

[Code Review](https://cythilya.github.io/2020/12/10/google-how-to-get-through-code-review/)