Como configurar Commitlint + Husky: commits padronizados para sua equipe

Quando falamos em projetos que usam git, o versionamento tem grande importância não só para gerenciar as versões e mudanças no projeto quanto para trabalhos que envolvam mais pessoas atuando no mesmo.

Eleger um padrão para este processo não é o crucial para o projeto tomar forma, porém, é de grande valia para garantir que todos entendam o que foi e será feito e a melhor forma de avançar (lembrando que processos podem ser mudados e readaptados conforme a situação e necessidade).

Com base nesse princípio, realizar commits suscintos mas que possamos bater o olho e ententer e que façam sentido com o que foi realizado pode agilizar o processo de desenvolvimento, ainda mais quando todos os commits seguem um padrão com ferramentas que garantam isso.

Commitlint

O Commitlint é uma lib que auxilia na utiliação de convenções ao realizar commits, sendo uma das mais conhecidas o padrão desenvolvido pela equipe de desenvolvimento do Angular.
A lib é altamente configurável, você consegue definir padrões que mais se encaixam com sua equipe, mas vale ressaltar que o padrão ‘conventional-config’ como é chamado e instalado por padrão já consegue atender bastante diversos cenários.

Instalação

Para esta instalação utilizaremos o seguinte comando:

yarn add -D @commitlint/cli @commitlint/config-conventional

💡 Neste caso estou utilizando o yarn mas funciona com npm sem problemas. Caso utilize pnpm ou yarn v2, recomendo uma lida na documentação pois pode variar o processo de instalação

Depois disso, criar aquivo .commitlintrc.config.js na raiz do projeto com o seguinte comando:

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

Configurado o commilint, se faz necessário entender o padrão de commits convencional para ser aplicado nos próximos commits a serem realizados. Cada commit inicia com um prefixo que se refere ao tipo e opcionalmente o escopo do projeto que foi afetado na mudança, antes da descrição do que foi realizado:

<tipo>[escopo opicional]: <descrição>
[corpo opcional]
[rodapé opcional]

Exemplo:

feat(lang): add Portuguese language

Dentre os tipos temos:

feat:

fix:

BREAKING CHANGE:

Também são aceitos os tipos baseados na convenção do framework Angular, que são:

build:
chore:
ci:
docs:
style:
refactor:
perf:
test:

Para mais exemplos da utilização acesse a documentação sobre os Commits Convencionais

Husky

Husky é uma ferramenta que utilizamos para auxiliar nossos commits atráves dos hooks do git. Em outras palavras, ele é chamado durante um commit onde podemos definir em quais situações (hooks) será chamado para verificar se nosso commit está sendo realizado dentro do padrão, rodar testes, realizar pequenas estilizações no código, etc.

Instalação

Instalar o Husky:

npm install husky --save-dev
# ou
yarn add husky --dev

Ativar os hooks:

npx husky install
# ou
yarn husky install

Adicionar um hook:

npx husky add .husky/commit-msg  'npx --no -- commitlint --edit ${1}'

Você pode realizar que verificará o último commit do projeto e se caso ele não estiver no padrão instalado (conventional-config), ele retornará um erro.

npx commitlint --from HEAD~1 --to HEAD --verbose

Pronto! agora você está utilizando o husky para verificar seus commits e sempre que houver alguma divergência em relação ao padrão de commit você receberá uma mensagem com este erro.

Bonus

O Commitizen é uma lib que permite commits em uma cli intuitiva com uma breve descrição sobre cada etapa da mensagem de commit que já adere a ‘conventional-config’ como padrão na instalação.

É uma lib bacana de utilizar principalmente para quem está se acostumando ainda com os commits nesse pattern.

Espero ter ajudado!