Can't get correct autoformat on save in Visual Studio Code with ESLint and Prettier

Question

in Visual Studio Code with ESLint and Prettier when working on .vue files, it seems I can\'t get vue/max-attributes-per-line to auto-fix correctly.

For example, with vue

Answer 1

I bumped into the same issue, and surprisingly found that prettier and vetur were conflicting. I had to disable vetur formatter and it now works as expected.

If you have this section in your editor's settings.json and you have prettier installed,

{
 "[vue]": {
     "editor.defaultFormatter": "octref.vetur",
  },
}

chances are, these two formatters are conflicting and thus the unexpected behaviour.

A quick workaround is to comment it as below, or simply delete it permanently.

{
 "[vue]": {
     // "editor.defaultFormatter": "octref.vetur",
  },
}