Commit messages can be a powerful tool if used properly. But either we don't realize it or are too lazy to give useful messages.

This is where commitlint comes in.

Commitlint

It forces every user (Yes! lousy teammates also) to follow certain rules while writing commit messages. The outcome is a well-structured commit history that you can quickly navigate.

Structure of a commit message looks like this:

<type>[optional scope]: <description>

[optional body]

[optional footer(s)]

For example:

feat: add dispay.js to display images

docs: new examples and GIFs

which includes type: description

How to install?

1. Run npm init command if you don't have package.json file.

   Remember Husky from my previous article? Time to use it again. If you don't have husky, head over here to install it.

2. Install commitlint:

   npm install -g @commitlint/cli @commitlint/config-conventional
   echo module.exports = {extends: ['@commitlint/config-conventional']}; > commitlint.config.js
   

   This should create a commitlint.config.js file inside your root directory.

3. Now go to package.json file and add:

   // package.json
   {
   "husky": {
    "hooks": {
      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
    }
   }
   }
   

   Done!

Try making a commit now.

For starters, commit as type: description

type must be one of the following:

• build: Changes that affect the build system or external dependencies (example scopes: gulp, broccoli, npm)
• ci: Changes to our CI configuration files and scripts (example scopes: Travis, Circle, BrowserStack, SauceLabs)
• docs: Documentation only changes
• feat: A new feature
• fix: A bug fix
• perf: A code change that improves performance
• refactor: A code change that neither fixes a bug nor adds a feature
• style: Changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc)

To get full set of rules, follow Conventional Commit.

Hope this is useful😊.