Pre-commit hook for eslint, linting *only* staged changes.

pre-commit.sh

#!/bin/bash

for file in $(git diff --cached --name-only | grep -E '\.(js|jsx)$')
do
  git show ":$file" | node_modules/.bin/eslint --stdin --stdin-filename "$file" # we only want to lint the staged changes, not any un-staged changes
  if [ $? -ne 0 ]; then
    echo "ESLint failed on staged file '$file'. Please check your code and try again. You can run ESLint manually via npm run eslint."
    exit 1 # exit with failure status
  fi
done

https://www.npmjs.com/package/eslint-plugin-diff

@aperkaz

LGTM, but maybe eslint should be run before prettier.

Note: If you use ESLint, make sure lint-staged runs it before Prettier, not after.
ref: https://prettier.io/docs/en/install.html#git-hooks

There is an cleaner way to accomplish this, with husky:

// package.json
...
"husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.{js,ts,tsx}": [
      "prettier --write",
      "eslint --ext .ts,.tsx,.js --fix"
    ]
  },

this worked for me & I also took @zhyd1997's suggestion

  },

@aperkaz
Where exactly i need to place above lines inside package.json file.

@Naveen9453 after the dependencies section is a good place, although I tend to locate it at the end of the file. No strict placement requirements though.

package.json configuration of husky no longer works, by design.