Prettier and eslint indents not working together

Solution 1:

As per this Kai Cataldo's comment on this GitHub issue:

ESLint's indent rule and Prettier's indentation styles do not match - they're completely separate implementations and are two different approaches to solving the same problem ("how do we enforce consistent indentation in a project").

Therefore, when using prettier, you'd better disable eslint's indent rule. It's guaranteed that they will clash.

Solution 2:

in eslintrc add indent: [2, 2, { SwitchCase: 1}]

Parameters defined

1. new eslint rules want the first parameter to be a number: Severity should be one of the following: 0 = off, 1 = warn, 2 = error.

2. the amount of indent

3. The object is stating how to indent switch and case statements following the options here.

Solution 3:

This should fix it https://github.com/prettier/eslint-config-prettier

It disables rules in eslint that conflict with prettier

Solution 4:

Turning off default Visual Studio Code parser and just leaving the eslint parser on save fixed it for me.

Just go to settings Ctrl/Cmd + ,, choose User (global settings) or Workspace (only for the working repo) and on top right corner click the paper with a turning arrow. That will open the declared settings on a json file. With the following settings it should work on any case:

{
  // other settings
  "editor.formatOnSave": false,
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true,
    "source.organizeImports": false
  },
  // other settings
}

Normally at the bottom of the Visual Studio Code window you have a Fix on save: X flag. That should be linked with this setting so make sure to leave it consistent.