CODEWITHSUNDEEP
eslintvisual-studio-code
Aviv Hadar
Aviv Hadar

Reputation: 490

Setting ESlint as formatter in VSCode settings.json - what is the proper way?

I see 2 options to set Eslint as my default formatted and I'm not sure on the difference between these options:

  1. "editor.defaultFormatter": "esbenp.prettier-vscode" or
  2. "eslint.format.enable": true

What is the difference between these 2 settings?

Upvotes: 11

Views: 25532

Answers (3)

Nagibaba
Nagibaba

Reputation: 5408

Also don't forget to comment out prettier.configPath:

// Comment out or remove this line
// "prettier.configPath": ".prettierrc.json",

"prettier.enable": false,

Upvotes: 0

Seangle
Seangle

Reputation: 688

You can put this into .vscode/settings.json:

{
  "editor.formatOnSave": true,
  "editor.codeActionsOnSave": {
    "source.organizeImports": "explicit",
    "source.fixAll": "never"
  },
  "eslint.format.enable": true,
  "editor.defaultFormatter": "dbaeumer.vscode-eslint",
  "prettier.enable": false
}

What this config does:

  1. ESLint is used for formatting (check out stylistic)
  2. You disable prettier
  3. The autoformat on save will not remove unreachable code, unlike the codeAction source.fixall

Upvotes: 7

Neel Dsouza
Neel Dsouza

Reputation: 1549

"eslint.format.enable": true basically tells VSCode to use ESlint as a formatter for files that are validated by ESLint and to make sure it always uses your default favourite Prettier formatter, you use "editor.defaultFormatter": "esbenp.prettier-vscode" as there can be multiple formatters installed.

Upvotes: 8

Related Questions