How do i add linting to pre-commit hook

Question

hi everyone i have a git repo that house 3 folders (individual js projects).

here's my pre-commit hook

#!/bin/bash
echo -e "\033[1;92m Linting Staged Files . . . "

files=$(git diff --diff-filter=d --cached --name-only | grep -E '\.(js|jsx)$')
path=(${files[0]//// })


if [[ $files = "" ]] ; then
  echo -e "\033[1;31m You have no staged file, exiting . . "
  exit 1
fi

for file in $files
do
git show ":$file" | $("./$path/node_modules/.bin/eslint --stdin --stdin-filename $file")
 if [ $? -ne 0 ]; then
   echo -e "\033[1;31m ESLint failed on staged file '$file'. \n Code will not be committed, Please fix your code and try again."
exit 1
 fi
done

BRANCH=`git rev-parse --abbrev-ref HEAD`

if [[ "$BRANCH" == "master" || "$BRANCH" == "develop" ]]; then
 echo "\033[1;31m commiting to $BRANCH is illegal."
 echo "\033[1;31m If you really know what you're doing, then add the argument '-n' to skip this git hook."
 exit 1
fi

exit 0

but it keeps failing at this line git show ":$file" | $("./$path/node_modules/.bin/eslint --stdin --stdin-filename $file") git show ":$file" | $("./$path/node_modules/.bin/eslint --stdin --stdin-filename $file")

with an error

.git/hooks/pre-commit: line 17: ./node_modules/.bin/eslint --stdin --stdin-filename sfa/src/SFAApp.js: No such file or directory

i have no idea what i'm doing wrong please help.

Answer 1

Never Mind i fixed the problem by changing

$("./$path/node_modules/.bin/eslint --stdin --stdin-filename $file")

to

./$path/node_modules/.bin/eslint --stdin --stdin-filename $file

TODO: research what $() really means in bash.

Answer 2

You're trying to run a command literally named:

./node_modules/.bin/eslint --stdin --stdin-filename sfa/src/SFAApp.js

rather than trying to run a command named:

./node_modules/.bin/eslint

with arguments:

--stdin

and:

--stdin-filename

and:

sfa/src/SFAApp.js

The cure is to fix your double quote placement. Once you do, you will probably have a second problem:

git show ":$file" | $(./$path/node_modules/.bin/eslint --stdin --stdin-filename "$file")

will run the command with the arguments, but then, because it is inside $(...) , will take its output as a command. I know nothing of eslint, but it seems likely that this should read:

git show ":$file" | ./$path/node_modules/.bin/eslint --stdin --stdin-filename "$file"

(I'm also not at all sure what the silliness with $path is about. The line path=(${files[0]//// }) sets path to the first file path-name component of the files listed by git diff , eg, if the output is a/b/c.js , path is set to a .)

Answer 3

You could use the npm package husky : https://www.npmjs.com/package/husky

By tapping into the git hook for pre-commit you could lint all the staged files exculding the deleted one by the line below

git diff --cached --name-only --diff-filter=d | grep ".js$" | xargs ./node_modules/.bin/eslint

Your .huskyrc will pretty much look like the one below:

module.exports = {
 'hooks': {
   'pre-commit': 'git diff --cached --name-only --diff-filter=d | grep ".js$" | xargs ./node_modules/.bin/eslint'
  }
}