Search code examples
vue.jsprettiervetur

Script part of .vue files gets formatted by Vetur but without the use of Prettier


Setup: New vue-cli 3.0 project w/ Typescript, ESlint Active plugins in VSCode: Vetur, Prettier

I checked all the settings I could find and experimented back and fro but couldn't solve the following issue:

Prettier formats the project's .ts files without any issues. In my .vue files Vetur uses prettyhtml for the template part which works fine too. For the script (lang="ts") part though, Vetur formats it based on some rules I cannot find anywhere - but definitely not Prettier/Prettier config. E.g. I changed singleQuotes = true and semi = false in my Prettier settings which works fine for my .ts files but within the script part in my .vue files it will just auto-format to double quotes and semi-colons.

Any idea why Vetur isn't relying on Prettier for the script part of .vue files? Also, where are the settings applied to that part (e.g. singleQuotes true/false)?


Solution

  • If I add a local .prettierrc file with { "singleQuote": true }, formatting will work as expected.