浜松のWEBシステム開発・スマートフォンアプリ開発・RTK-GNSS関連の開発はお任せください
株式会社シーポイントラボ
TEL:053-543-9889
営業時間:9:00~18:00(月〜金)
住所:静岡県浜松市中区富塚町1933-1 佐鳴湖パークタウンサウス2F

【JavaScript】Vue.jsのソースコードから見るコミットメッセージ管理

 Vue.jsはOSSで開発されているJavaScriptのフレームワークであり、その人気からか多くの開発者(記事作成時点で285人)が開発に参加しています。これだけの大人数で開発しているとコードやドキュメントやらが無秩序になるので、そうならないための対策が必要になります。この記事で紹介するのはその対策の一つであるコミットメッセージのルールを自動で守らせる仕組みです。

 Vue.jsのソースコードには次のようにあります。
vue/package.json at dev · vuejs/vue

  "gitHooks": {
    "pre-commit": "lint-staged",
    "commit-msg": "node scripts/verify-commit-msg.js" // このJavaScriptでコミットメッセージを制御
  },

 verify-commit-msg.jsは次のようになっています。

const chalk = require('chalk')
// Gitのコミットメッセージを取得
const msgPath = process.env.GIT_PARAMS
const msg = require('fs').readFileSync(msgPath, 'utf-8').trim()

// 正規表現でメッセージをチェック
const commitRE = /^(revert: )?(feat|fix|polish|docs|style|refactor|perf|test|workflow|ci|chore|types|build)(\(.+\))?: .{1,50}/

if (!commitRE.test(msg)) { // msgが正規表現に一致しなければエラー表示、エラー終了
  console.log()
  console.error(
    `  ${chalk.bgRed.white(' ERROR ')} ${chalk.red(`invalid commit message format.`)}\n\n` +
    chalk.red(`  Proper commit message format is required for automated changelog generation. Examples:\n\n`) +
    `    ${chalk.green(`feat(compiler): add 'comments' option`)}\n` +
    `    ${chalk.green(`fix(v-model): handle events on blur (close #28)`)}\n\n` +
    chalk.red(`  See .github/COMMIT_CONVENTION.md for more details.\n`) +
    chalk.red(`  You can also use ${chalk.cyan(`npm run commit`)} to interactively generate a commit message.\n`)
  )
  process.exit(1)
}

 我々日本人の上、案件によって適したメッセージは違うのでこれをこのまま使うパターンが最適ということはまずありませんが、基本パターンはコメントにある部分をなぞるのがよいでしょう。小規模案件ならばcommitの種類を絞ってメッセージを日本語にするだけでもだいぶ扱いやすくなります。例えば次です。

const chalk = require('chalk')
// Gitのコミットメッセージを取得
const msgPath = process.env.GIT_PARAMS
const msg = require('fs').readFileSync(msgPath, 'utf-8').trim()

// 正規表現でメッセージをチェック
const commitRE = /^(revert: )?(fix|add|docs|refactor|rm|test|tmp)(\((機能A|機能B|機能C)\))?: .*/

if (!commitRE.test(msg)) { // msgが正規表現に一致しなければエラー表示、エラー終了
  console.log()
  console.error(
    `  ${chalk.bgRed.white(' ERROR ')} ${chalk.red(`コミットメッセージの形式が不適正です.`)}\n\n` +
    chalk.red(`  コミットをするには適切なメッセージ形式が必要です. 例:\n\n`) +
    `    ${chalk.green(`add(機能A): 機能Aのほげほげを追加`)}\n` +
    `    ${chalk.green(`fix(機能B): ふがしていた問題を修正`)}\n\n` +
    chalk.red(`  コミットメッセージは次の正規表現に従っている必要があります.\n`) +
    chalk.red(`  ${commitRE}\n`)
  )
  process.exit(1)
}


 何かしらフォーマットの定まったコミットがされていると後でgrepするのがとても楽になります。フォーマットを統一する際に個々の良心と注意深さに依存するのは難しいので自動化するのは有効な部類と自分は考えています。

  • この記事いいね! (0)