eslint pre-commit

pre-commit

#!/bin/bash

# Functions:
# 1.Linting and Beautification of JS files
# 2.Linting of CSS files
# 3.Linting of HBS files


# Installation :
# 1. Go to source folder and type (cmd+shift+. in mac) to show hidden files
# 2. Replace the below file with **pre-commit.sample** in /.git/hooks/ 
# 3. Save it as `pre-commit` (No file format required)
# 4. Enable read access to the file chmod +x pre-commit (to be run in the '.git/hooks' folder)


#-------- Config -----------#
ESLINT="$(git rev-parse --show-toplevel)/node_modules/.bin/eslint"
TEMPLATELINT="$(git rev-parse --show-toplevel)/node_modules/.bin/ember-template-lint"
PRETTIER=`npm list -g prettier | grep empty`
JSPASS=true
HBSPASS=true
CSSPASS=true
JSCOUNT=0
HBSCOUNT=0

checking_setup()
{
echo "Checking ESlint and Prettier packages..."
if [[ ! -x "$ESLINT" ]]; then
  echo "⁉️ esLint is not installed, Please install it first ( npm install eslint --save-dev )"
  exit 1
elif [[ -n "$PRETTIER" ]]; then
  echo "⁉️ Prettier is not installed, Please install it first ( npm install -g prettier )"
  exit 1
elif [[ ! -x "$TEMPLATELINT" ]]; then
  echo "⁉️ Ember template lint is not installed, Please install it first ( npm install --save-dev ember-template-lint )"
  exit 1
fi
}

#-------- Validation Code -----------#

# ----- JS #
lint_js()
{
echo "🔍 Finding ESLINT errors"
JSFILES=`git diff --staged --diff-filter=ACMTUXB --name-only -- '*.js'`
for FILE in $JSFILES
do
  $ESLINT --ignore-path '.template-lintrc.js' "$FILE"
  if [[ "$?" == 0 ]]; then
    echo "✅ ESLint passed for '$FILE'"
  else
    echo "❌ ESLint failed for '$FILE'"
    JSPASS=false
    JSCOUNT=$((JSCOUNT + 1))
  fi
done
} 
#----- HBS #
lint_hbs()
{
echo "🔍 Finding template lint errors"
HBSFILES=`git diff --staged --diff-filter=ACMTUXB --name-only -- '*.hbs'`
for FILE in $HBSFILES
do
  $TEMPLATELINT "$FILE"
  if [[ "$?" == 0 ]]; then
    echo "✅ Template lint passed for '$FILE'"
  else
    echo "❌ Template lint failed for '$FILE'"
    HBSPASS=false
    HBSCOUNT=$((HBSCOUNT + 1))
  fi
done
}

# ----- CSS #
lint_css()
{
echo "🔍 Finding CSSLINT errors"
CSSFILES=`git diff --staged --diff-filter=ACMTUXB --name-only -- '*.css'`
for FILE in $CSSFILES
do
  css_lint_errors=`csslint --format=compact $FILE | grep 'Error -'`
		if [ -n "$css_lint_errors" ]; then
			  echo "❌ CSSLint failed for $FILE"
        echo "$css_lint_errors"
        errors=("${errors[@]}" "$css_lint_errors")
			  CSSPASS=false
		fi
   css_lint_warning=`csslint --format=compact $FILE | grep 'Warning -'`
		if [ -n "$css_lint_warning" ]; then
			echo "❌ $css_lint_warning"
			CSSPASS=false
		fi
done
}

#-------- Code Beautification -----------#
beautify_js()
{
echo "💅 Beautifying JS Code"
echo "$JSFILES" | xargs prettier --write
echo "$JSFILES" | xargs git add
}

#-------- Starts here --------#
checking_setup
lint_js
echo " ----- "
#lint_css
#echo " ----- "
lint_hbs
echo " ----- "

#-------- Post Validation  -----------#
if ! $JSPASS; then
  echo "❌ ❌ ❌ Commit Failed - Please fix eslint errors (Files with errors: $JSCOUNT) and try again."
  exit 1
fi
if ! $CSSPASS; then
  echo "❌ ❌ ❌ Commit Failed - Please fix csslint errors and try again."
  exit 1
fi
if ! $HBSPASS; then
  echo "❌ ❌ ❌ Commit Failed - Please fix ember lint errors (Files with errors: $JSCOUNT) and try again."
  exit 1
fi
if $CSSPASS && $JSPASS && $HBSPASS; then
  beautify_js
  echo "✨✨✨ Commit Successful"
  exit 0
fi

exit $?


# Contributors (Thank you!!)
# https://github.com/saravanag - Has setup `.hbs` linting.