Pre-Commit Hooks. Why do you need this?
This way of using pre-commit hooks I use for each kind of project which I develop Java, Kotlin, and TypeScript. If you need to provide some pre-commit scripts you could follow this short guide and do the same for your projects.
Prerequisites
Before, you need to do install Node.js and some additional tools.
First of all, let’s install the nvm tool that allows managing Node versions easily.
> curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash
> source ~/.bashrc
Now, create .nvmrc
file in the root folder of your project, and add the following line:
lts/gallium
where, lts/gallium
is a version of Node.js which is Active LTS for that moment. You could check versions of Node.js here.
Then run the following command in the root folder of your project, which will install and apply the specified version of Node.js in the .nvmrc file.
nvm use
This way allows don’t care about Node.js for each development environment. Just execute nvm use
on the new machine.
I’m using Java, why should I install Node.js?
Using Node.js we will provide a comfortable way of executing scripts or/and some needed development tools. In our case, it is a pre-commit hook tool.
Configure NPM project
Let’s initialize the NPM project. NPM is already installed on your machine in the scope of Node.js installation.
npm init
It creates a package.json
. I deleted the extra fields in this file and use the following:
{
"name": "[project name here]",
"version": "1.0.0",
"description": "",
"scripts": {
"test": "echo \"test\""
}
}
Create a first Git Hook
Before, let’s install NPX tool as a global dependency for Node.js. It helps to use Node.js tools without installing them locally.
npm install -g npx
Now, we are ready to create our first hook. Let’s say that I want to format *.ts,tsx
files before commit operation. We need to install the following npm development dependencies:
npm install -D husky lint-staged
where, husky allows to manage git hooks and lint-staged helps to apply specific script for changed files only.
Now, we have to initialize husky, which will create a folder named as .husky
with future hooks.
npx husky install
And, let’s create a first pre-commit
hook:
npx husky add .husky/pre-commit "npx lint-staged"
You will see the file .husky/pre-commit
contains:
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"
npx lint-staged
After, these steps we can add configuration to package.json
for the lint-staged and define for husky a hook.
{
"name": "[project name here]",
"version": "1.0.0",
"scripts": {},
"devDependencies": {
"husky": "^8.0.1",
"lint-staged": "^13.0.3"
},
"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
},
"lint-staged": {
"**/*.{ts,tsx}": "prettier --write" // this script will execute as a pre-commit hook
}
}
As a
lint-staged
script, I’m using the prettier tool to format*.ts
,*.tsx
files. You could use any script you want.
Using pre-commit hook
Each time when you will commit changed files which defined as a pattern in lint-staged
git will use pre-commit hook specified in husky > hooks > pre-commit
.
> git add .
> git commit -m 'Test pre-commit hook.'
✔ Preparing lint-staged...
✔ Running tasks for staged files...
✔ Applying modifications from tasks...
✔ Cleaning up temporary files...
[master 61115dc] Added pre-commit hook for using pretier
38 files changed, 1007 insertions(+), 526 deletions(-)
create mode 100755 .husky/pre-commit
Enjoy!