How To Disable VS Code ‘formatOnSave’ For Specific File Extensions?

VS Code

I’m currently exploring Plush templating language and I noticed that my VS Code formatOnSave still kicks in when I’m saving files with .plush.html extension.

This post describes how I switched it off after getting some hints from the official docs.

Do note that if you are working with popular languages, you can skip the files.associations block in step #2 below and just put the second block with your language name i.e. "[javascript]": {}.

Step #1 — Open Settings

By pressing Cmd + , on Mac, you will land on Settings GUI page.

Click the Open Settings (JSON) icon on top right of the screen.

Step #2 — Extend The Settings

Add these lines inside the settings.json file:

{
    // Your current settings. Don't forget to put comma symbol...
    // ...at the end of your current settings last object.
    "files.associations": {
        "*.plush.html": "plush"
    },
    "[plush]": {
        "editor.formatOnSave": false
    }
}

Step #3 — Save

Hit Cmd + S to save it and the formatOnSave will be disabled on extensions you listed in previous step.

Step #4 — (Optional) Re-enable HTML Snippets

If you’re working with HTML inside another templating language like me, you might want to continue working with Emmet that could help you with HTML tag completions and suggestions.

To make Emmet works with the “new” language that we just added, add these lines inside the same settings.json file and save it.

"emmet.includeLanguages": {
    "plush": "html"
}

That’s it! Hit me up on Twitter if you didn’t manage to get it working. I probably could help you.