Search code examples
editorvisual-studio-codeprettier

Format onsave does not work in VS Code with Prettier

I'm using VS Code with ES Lint and Prettier and they worked fine.

But today I noticed that Prettier doesn't format the code on save as it was doing before. I haven't done any updates or changes so I don't know why is this happening.

When I go into Settings it is already checked:

enter image description here

And if I deleted a ; or add an extra space in the code it shows it as an error in Prettier but I have to do a right click and choose to fix the problems. I don't know why aren't this done automatically as before.

enter image description here

settings.json:

{
    "explorer.confirmDelete": false,
    "javascript.preferences.quoteStyle": "single",
    "typescript.preferences.quoteStyle": "single",
    "prettier.jsxSingleQuote": true,
    "prettier.singleQuote": true,
    "javascript.updateImportsOnFileMove.enabled": "always",
    "window.zoomLevel": 0,
    "editor.formatOnSave": true
}

Any ideas on how to solve this annoying problem?

Solution 
  •     "editor.defaultFormatter": "esbenp.prettier-vscode",

    Adding that to the settings.json works for me

    Full settings.json:

    {
"window.zoomLevel": 0,
"workbench.editor.enablePreview": false,
"workbench.editor.enablePreviewFromQuickOpen": false,
"[typescriptreact]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
},
"git.autofetch": true,
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true

    }