@appenin/eslint-config

Appenin's ESLint config with TypeScript and React support

Setup

1) Install

yarn add -D @appenin/eslint-config

For the backend, add:

yarn add -D [email protected] typescript @typescript-eslint/parser eslint-config-prettier prettier eslint-config-standard eslint-plugin-chai-friendly eslint-plugin-import eslint-plugin-simple-import-sort eslint-plugin-mocha eslint-plugin-node eslint-plugin-prettier eslint-plugin-promise eslint-plugin-standard

For the frontend, add:

yarn add -D [email protected] typescript @typescript-eslint/parser @typescript-eslint/eslint-plugin prettier eslint-config-prettier eslint-plugin-prettier eslint-config-next

2) Configure ESLint

Add "extends": ["@appenin/eslint-config"] to your ESLint config file.

If you need React support, add "extends": ["@appenin/eslint-config/next"] instead.

This config requires knowledge of your TypeScript config. In your ESLint config, set parserOptions.project to the path of your tsconfig.json.

An example .eslintrc:

{
  "extends": ["@appenin/eslint-config/next"]
}

3) Run ESLint

Open a terminal to the root of your project, and run the following command:

npx eslint . --ext .js,.jsx,.ts,.tsx

ESLint will lint all .js, .jsx, .ts, and .tsx files within the current folder, and output results to your terminal.

You can also get results in realtime inside most IDEs via a plugin.

4) Fix on save Eslint errors

JetBrains IDE (WebStorm, Intellij)

1. JetBrains IDE already provide Eslint plugins.
2. You just need to do to Preferences > Languages & Framework > Eslint and check run eslint --fix on save

VS Code

1. Install EsLint plugins for VS Code
2. Go to Preferences > edit settings.json
3. Paste the following code:

{
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  }
}