Better Git Commits with `@commitlint`

Muhammad A Faishal - Sep 11 '23 - - Dev Community

When working on a project together, Git is a crucial tool that help teams collaborate smoothly. One of the key features is commits, which act like snapshots of the project's progress.

git commit

However, do you know which one of my commit add a new feature? I'm sure you won't, including me...

The problem is I was naming the commit randomly without looking at the context which makes it harder for me to identify when I want to revert the changes.

commitlint

To solve the problem, there is a useful linter named commitlint. It will prevent us from naming our commits randomly

// git commit
git commit -m "oops"

// it will trigger this error 
// ❌ type must be one of [build, chore, ci, docs, feat, fix, perf, refactor, revert, style, test] [type-enum]
Enter fullscreen mode Exit fullscreen mode

and force us to name the commit properly.

git commit -m "fix: resolve the issue related to comma"
git commit -m "feat: add a feature named calculator"
Enter fullscreen mode Exit fullscreen mode

It's very clear and easy to understand the context, right?

The following are all the types that commitlint suggests and provides including the example commit:

  • build --> Changes that affect the build system or external dependencies
git commit -m "build: update npm dependency"
Enter fullscreen mode Exit fullscreen mode
  • ci --> Changes to our CI configuration files and scripts
git commit -m "ci: add circleci configuration file"
Enter fullscreen mode Exit fullscreen mode
  • docs --> Documentation only changes
git commit -m "docs: update readme with installation instructions"
Enter fullscreen mode Exit fullscreen mode
  • feat --> A new feature
git commit -m "feat: add user authentication feature"
Enter fullscreen mode Exit fullscreen mode
  • fix --> A bug fix
git commit -m "fix: resolve issue with incorrect data rendering"
Enter fullscreen mode Exit fullscreen mode
  • perf --> A code change that improves performance
git commit -m "perf: optimize database query for faster response times"
Enter fullscreen mode Exit fullscreen mode
  • refactor --> A code change that neither fixes a bug nor adds a feature
git commit -m "refactor: reorganize code structure for better readability"
Enter fullscreen mode Exit fullscreen mode
  • style --> Changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc)
git commit -m "style: format code according to Prettier standards"
Enter fullscreen mode Exit fullscreen mode
  • test --> Adding missing tests or correcting existing tests
git commit -m "test: add unit tests for user authentication"
Enter fullscreen mode Exit fullscreen mode

There are many features of commitlint that I can't mention one by one, as well as installation guide. To know the detail you can directly access https://github.com/conventional-changelog/commitlint.

. . . . . . . . . . . .
Terabox Video Player