Master Conventional Commits: Streamline Git with Commitizen, cz‑customizable & Commitlint

Conventional Commits is a specification for Git commit messages that standardizes the format to improve readability, maintainability, and automation of versioning.

What is Conventional Commits

The format consists of a <type>, optional [scope], and a <description>, followed by optional body and footer sections. Example syntax:

<type>[optional scope]: <description>

[optional body]

[optional footer(s)]

Common types include feat (new feature), fix (bug fix), docs (documentation), and many others such as style, refactor, perf, test, build, ci, chore, and revert. Breaking changes are indicated by BREAKING CHANGE: in the footer or by appending ! to the type.

Why Use Conventional Commits

Standardized messages make it easier for team members to understand changes, generate changelogs, automate version bumps, and integrate with CI/CD tools.

How to Adopt Conventional Commits

Step 1: Commitizen

Commitizen provides an interactive CLI to generate compliant commit messages.

pnpm install -g commitizen
pnpm install -g cz-conventional-changelog

Create a .czrc file in your home directory with:

{"path": "cz-conventional-changelog"}

Then run:

git cz

Step 2: cz‑customizable

cz‑customizable lets you customize the prompts and available types.

npm install cz-customizable --save-dev

Add to package.json:

"config": {"commitizen": {"path": "node_modules/cz-customizable"}}

Create a .cz-config.js file to define types, messages, and limits (example shown in the original article).

Step 3: Commitlint

Commitlint validates commit messages against the Conventional Commits rules.

npm i @commitlint/config-conventional @commitlint/cli -D

Create commitlint.config.js:

module.exports = {extends: ['@commitlint/config-conventional']}

If using cz‑customizable, install the cz config:

npm install commitlint-config-cz --save-dev

module.exports = {extends: ['cz']}

Step 4: Husky

Husky runs scripts on Git hooks (e.g., pre‑commit).

pnpm install husky --save-dev

Add hooks in package.json:

"husky": {"hooks": {"pre-commit": "npm run lint && npm test"}}

Step 5: lint‑staged

lint‑staged runs linters on staged files before committing.

npm i lint-staged --save-dev

Configure in package.json:

"lint-staged": {"**/*.js": "eslint --fix", "**/*.{css,scss}": "stylelint"}

Additional Tips

You can also use ChatGPT as a commit message generator by providing a prompt that follows the Conventional Commits format.