ESLint, Prettier, Husky

Base configs to combine these packages in project

Node env

node version: 12.16.2
npm version: 7.19.0

Packages version

"eslint" : "^7.32.0",
"prettier" : "2.4.1"

Install and config eslint

npm install eslint -D
./node_modules/.bin/eslint --init
# For question How would you like to use ESLint?
# To check syntax, find problems, and enforce code style
# ...
# For question How would you like to define a style for your project?
# Use a popular style guide
# ...

Install and config prettier, eslint-config-prettier

npm i prettier eslint-config-prettier -D
# Create prettier config
echo {}> .prettierrc.json
# Create prettier ignore file
touch .prettierignore
# Let prettier work with with eslint
# Config .eslintrc.* file
# Put "prettier" at last of values in the extends prop
"extends": [
  "airbnb-base",
  "prettier"
]

Install and config husky , lint-staged

npm install --save-dev husky lint-staged
npx husky install
npm set-script prepare "husky install"
npx husky add .husky/pre-commit "npx lint-staged"
# add to package.json
"lint-staged": {
   "*.{js,css}": "prettier --write . --ignore-unknown"
}
# If you use ESLint, make sure lint-staged runs it before Prettier, not after.

# eslint support newer syntax
npm i --save-dev @babel/eslint-parser @babel/eslint-plugin
# modify your .eslintrc.* file
{
  parser: '@babel/eslint-parser',
  plugins: ['@babel']
}

Click to get package file