心配をやめ、gitフックが大好きであることを学んだ方法
Gitは強力なバージョン制御システムですが、Commitの品質を本質的に保証するものではありません。エラー、役に立たないメッセージ、またはフォーマット不良でコードをコミットできます。 Gitフックはソリューションを提供します。このチュートリアルでは、コミット基準を実施するためにGitフックを実装し、よりクリーンなコードベースとよりスムーズなコラボレーションを確保する方法を示しています。
特定の基準を満たすことのみを許可するフックを作成します。チェックに失敗すると、有益なエラーメッセージが修正に向けてガイドされます。ボーナスとして、通過するコミットは自動的にフォーマットされます。
前提条件
node.js、npm、およびgitに対する基本的な知識が想定されています。 package.json
またはgit commit -m [message]
について確信が持てない場合は、先に進む前に関連するドキュメントを参照してください。
私たちのアプローチ
依存関係をインストールし、3つのコミットチェックを設定します。
- 糸くず:コードには糸くずエラーがない必要があります。
- 単体テスト:関連する単体テストが合格する必要があります。
- メッセージフォーマットのコミット:メッセージは事前定義された形式(従来のコミット形式)に付着する必要があります。
最後に、通過するコミットは、Prettierを使用して自動的にフォーマットされます。重要なことに、これらのチェックは段階的なファイルでのみ実行され、オーバーヘッドを最小限に抑えます。このプロセスはスタックに依存しています。好みのツール(冗談の代わりにモカ)に適応します。
依存関係のインストール
まず、ハスキー(フックの管理用)と糸くずのステージ(ステージファイルでリナーを実行するため)をインストールします。
npm iハスキーリントステージ - save-dev
次に、Commitメッセージの検証のためにcommitlintをインストールします。
npm install @commitlint/{config-conventional、cli} - save-dev
Windowsユーザーの場合:
npmインストール @commitlint/config-conventional @commitlint/cli - save-dev
従来の形式を使用するようにcommitlintを構成します。
echo "module.exports = {extends:['@commitlint/config-conventional']}"> commitlint.config.js
コミット前のフックの実装
これらのスクリプトを使用してpackage.json
を想定しましょう(プロジェクトに調整します):
「スクリプト」:{ "start": "webpack-dev-server -config ./webpack.dev.js - モード開発"、 「ビルド」:「webpack -config ./webpack.prod.js - モード制作」、 「テスト」:「jest」、 「LINT」:「TSC -NoeMit」、 "prettier": "prettier - -single-quote - print-width 80 \" **/*。{js、ts} \ "-write" }
package.json
でハスキーと糸くずの段階を構成します:
「ハスキー」:{ 「フック」:{ 「事前コミット」:「Lint-Staged」 } }、 「リントステージ」:{ "./**/*. {Ts}":[ 「NPM Run Lint」、 「npm run ittier」 ] }
これにより、各コミットの前に段階的なタイプスクリプトファイルでlint
とprettier
なります。ユニットテストを含めるには、Jestを追加します。
「リントステージ」:{ "./**/*. {Ts}":[ 「NPM Run Lint」、 「jest - bail - coverage - findrelatedtests」、 「npm run ittier」 ] }
メッセージメッセージの検証については、Huskyにcommit-msg
フックを追加します。
「ハスキー」:{ 「フック」:{ 「commit -msg」:「commitlint -e huskky_git_params」、 「事前コミット」:「Lint-Staged」 } }、
これで、糸くずエラー、テストの失敗、または不適切にフォーマットされたコミットメッセージが検出された場合、コミットは失敗します。きれいな人は、通過するコミットを自動的にフォーマットします。この合理化されたワークフローにより、コードの品質とチームのコラボレーションが大幅に向上します。
以上が心配をやめ、gitフックが大好きであることを学んだ方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中国語版
中国語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック











先日、Corey Ginnivanのウェブサイトから、この特に素敵なビットを見つけました。そこでは、スクロール中にカードのコレクションが互いに積み重ねられていました。

Google Fontsが新しいデザイン(ツイート)を展開したようです。最後の大きな再設計と比較して、これははるかに反復的です。違いをほとんど伝えることができません

プロジェクトにカウントダウンタイマーが必要だったことはありますか?そのようなことのために、プラグインに手を伸ばすのは自然なことかもしれませんが、実際にはもっとたくさんあります

フレックスレイアウトの紫色のスラッシュ領域に関する質問フレックスレイアウトを使用すると、開発者ツールなどの混乱する現象に遭遇する可能性があります(D ...

要素の数が固定されていない場合、CSSを介して指定されたクラス名の最初の子要素を選択する方法。 HTML構造を処理するとき、あなたはしばしば異なる要素に遭遇します...

新しいプロジェクトの開始時に、SASSコンピレーションは瞬く間に起こります。これは、特にbrowsersyncとペアになっている場合は素晴らしい気分です。

フロントエンド開発でWindowsのような実装方法...
