DEV Community

Discussion on: [2021] Setting up Husky pre-commit hook with ESLint, Prettier and lint-staged for React and React Native.

 
klaus profile image
Yash Kalaria • Edited

Try replacing your "lint" command in package.json with below command and if that works then you can do something similar for prettier too.

"lint": "eslint src/**/**/*.js --fix-dry-run git diff --diff-filter=d --cached --name-only | grep -E './**/*.(js|jsx|ts|tsx|css|scss|md)$'"

Thread Thread
 
maaverik profile image
Nithin • Edited

Thanks for the post Yash, it was very helpful. Just wanted to point out that I don't think this is necessary. Correct me if I'm wrong, but from the lint-staged documentation and from what I see from my own project after setting this up, linting runs for only the files which are staged and also match the specified glob pattern.

"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
},
"lint-staged": {
"*.{js,jsx,ts,tsx}": [
"npx prettier --write",
"eslint --ext .js,.jsx --fix-dry-run"
]
}

I used this setting and it only throws lint errors for staged changes while I commit even though there are other unstaged files with lint errors.

I think the line to note is
"eslint src/*.js --fix-dry-run" which you've mentioned.

I've used "eslint --ext .js,.jsx --fix-dry-run" without specifying a target, so that it doesn't run for all files in the src directory, only the staged files that are fed into this command by lint-staged.

Thread Thread
 
klaus profile image
Yash Kalaria

Updated for 2021 with all the fixes

Some comments have been hidden by the post's author - find out more