Understanding the roles of the 3 musketeers:
- Husky : Husky makes Git hooks simpler to aid its adoption and thus prevent bad code from being pushed to central repository. Instead of expecting your developer to run your ESLint before they commit their changes, you are better off with this being done automatically at the earliest. The earliest that could be here is when the developer commits his code changes to his local branch. You could write a pre-commit Git-hook that gets executed before the commit and successfully commits the changes only if there are no linting errors. This is where Husky comes to the rescue. By installing it as part of your project dependency, you simply configure the Git-hook like below in your package.json file:
- Lint-Staged : As developer you have this crazy attitude to further your productivity. You wouldn't want to waste your precious time running through the linting process for your entire project repository for every commit of yours when you have only changed a few files at best for the intended commit. You feel better off executing the lint over the modified files that you are about to commit than the entire project as is automated. Lint-Staged comes to aid you and the automation here. With this module, only files of configured pattern that are modified by you are tested against by the linter instead of the entire project source code.
Below is a sample package.json file configuration where you see how the 3 musketeers are put together for your enhanced productivity:
Bingo!, with just that, you now have much more time to waste elsewhere like on Facebook, Hacker News, Reddit, Quora, Yahoo News and others..without compromising on the code quality.