ESLint and Prettier config for front projects

Installing

1. In your project folder, run:

npm i -D @axeptio/eslint-config-axeptio-front eslint prettier @typescript-eslint/eslint-plugin @typescript-eslint/parser @next/eslint-plugin-next eslint-config-prettier eslint-module-utils eslint-plugin-babel eslint-plugin-prettier@alpha eslint-plugin-react eslint-plugin-better-styled-components

2. Now, create (or update) a .eslintrc.js file with the following content:

module.exports = {
  extends: '@axeptio/eslint-config-axeptio-front'
};

3. Add prettier config in your repo

{
  "semi": true,
  "tabWidth": 2,
  "singleQuote": true,
  "bracketSpacing": true,
  "printWidth": 130,
  "arrowParens": "avoid",
  "trailingComma": "none",
  "endOfLine": "auto"
}

VSCode config

Go to User settings (settings.json) and add:

"editor.tabSize": 2,
"editor.formatOnSave": true,
"editor.formatOnPaste": false,
"editor.formatOnSaveMode": "modifications",
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.codeActionsOnSave": {
  "source.fixAll.eslint": true,
  "source.fixAll.format": true
},