Git Hooks with Husky

Braydon Coyer

Braydon Coyer / October 12, 2020

4 minute read

--- views
Cover

Did you know Git has a way to run commands when certain client-side actions occur? Yep! They’re called Git Hooks and if you aren’t utilizing them, you’re missing out big time.

Wouldn’t it be cool if you could create custom scripts to be run before committing your code? What about right before you push your code to a repository?

While there are many Git Hook solutions out there, my favorite is a little package called Husky.

NPM - Husky

Installing Husky

Inside your project directory, run npm install husky --save-dev to add the dependency to your package.json file.

Real World Examples

Now that Husky is installed, let’s utilize the package and add a few hooks.

First, open your package.json file and add the following:

1{
2 "husky": {
3 "hooks": {
4 "pre-commit": "npm test"
5 }
6 }
7}

The example above will run your project’s unit tests before committing your code. If the tests fail, your code won’t be committed. This is extremely powerful and helps eliminate broken code being pushed to a repository.


While it’s never good to push broken code, pushing code that isn’t formatted isn’t very nice either.

Take a look at this handy example!

1{
2 "husky": {
3 "hooks": {
4 "pre-commit": "ng lint --fix"
5 }
6 }
7}

This pre-commit hook will ensure that your code is formatted correctly before committing your code. Nice, huh? Remember, Husky allows you to execute custom scripts based on certain actions, so you can make pretty much anything happen - it doesn’t have to be running unit tests or formatting your code.

Taking it a Step Further

Keep in mind that if you’re working on a team, because the Hooks live in the package.json file, other team members will also be able to take advantage of Husky.

But what if they don’t want to use Husky? No problem. You can extract the functionality to a different file. And it’s crazy simple.

Create a new file called .huskyrc and then add your Husky configuration.

1{
2 "husky": {
3 "hooks": {
4 "pre-commit": "ng lint --fix"
5 }
6 }
7}

Just make sure that your .huskyrc file is ignored in your git commit.

Conclusion

With very minimal set up, you can run your own custom scripts with Husky. There’s so much you can do - in fact, why not check out all of the Git Hooks that Husky supports?

Git - githooks Documentation

Sure, a lot of these safeguards and features can be added in your external CI/CD pipelines, but if you don’t have time to set one up, this is a great alternative.

Thanks for reading! If you liked this article and want more content like this, read some of my other articles, subscribe to my newsletter below and make sure to follow me on Twitter!

Join my newsletter!

A periodic update about my life, recent blog posts, tutorials and discoveries.