WeMaintain code style

eslint

For the basic JS code style, we use the StandardJS preset You can find the rules here.

tslint

On top of this config, we have to use the Typescipt parser to build an understandable AST for ESLint and the the @typescript-eslint/eslint-plugin to add custome rules for typescript.

Set up your project

1. Install the eslint config:

   yarn add -D @wemaintain/eslint-config

2. Install all peerDependencies of this config:

   yarn add -D $(npm view --json "@wemaintain/eslint-config" peerDependencies | sed 's/\":\ \"/@/g' | sed '1d;$d' | sed 's/,//g' | sed 's/\"//g' | sed -e :a -e '$!N; s/\n//; ta')

3. Create your tsconfig.json file with this minimal configuration:

   {
       "extends": [
           "@wemaintain/eslint-config/tsconfig.default.json" 
       ]       
   }

   Or simply:

   cp node_modules/@wemaintain/eslint-config/preconfig/tsconfig.json .

   Your tsconfig.json should extend the default tsconfig to set basics options for the compiler, like use es6 libraies, enable decorators, use strict mode, ect.

   See all other compiler options

4. Create the .eslintrc.json (or copy the .eslintrc.json from this repository) with this minimal configuration:

   {
       "extends": [
           "@wemaintain/eslint-config"
       ],
       "parserOptions": {
           "project": "/path/of/your/tsconfig.json"
       }
   }

   Or simply:

   cp node_modules/@wemaintain/eslint-config/preconfig/.eslintrc.json .

   Your .eslintrc.json should extend the default eslint presets which, itself inherits from the standardJS rules code style for javascript and typescript-eslint recommended rules for typescript as well as some additional rules.

(For VSCode) Auto format on save from eslint rules

1. Install the extension dbaeumer.vscode-eslint
2. Add the following to your vs-code settings (or copy the .vscode folder into you project from this repository) :

   {
        "javascript.format.enable": false,
        "typescript.format.enable": false,
        "editor.formatOnSave": false,
        "eslint.enable": true,
        "eslint.validate": [
            "javascript",
            "typescript",
        ],
        "[typescript]": {
            "editor.defaultFormatter": "dbaeumer.vscode-eslint"
        },
        "eslint.alwaysShowStatus": true,
        "editor.codeActionsOnSave": {
            "source.fixAll.eslint": true 
        },
        "editor.detectIndentation": false,
        "editor.tabSize": 2
   }

   Or simply:

   cp -r node_modules/@wemaintain/eslint-config/preconfig/.vscode/ .

Now when you save the file, the formatter will auto fix some code style errors.