How to set per-filetype tab size?

How to set tab size is already answered here.

But how to have different settings for different file types? E.g. I want the tab size for HTMLs to be 2, but for other files to be 4.


Solution 1:

VS Code configures language specific settings in settings.json

  • Shortcut is: Command Palette (⇧⌘P) then: Preferences: Configure Language Specific Settings

Example of setting.json changing tabsize

{
    "[sass]": {
        "editor.tabSize": 2
    },
    "[html]": {
        "editor.tabSize": 4
    },
    "[javascript]": {
        "editor.tabSize": 2
    }
}

These are not nested inside any other object, they are defined at the root.

Solution 2:

With vscode v1.63 you will be able to "group" languages in language-specific settings like this:

"[sass][javascript]": {
    "editor.tabSize": 2
},
"[html]": {
    "editor.tabSize": 4
}

This already can be done in the colorCustomizations setting like:

"workbench.colorCustomizations": {
    "[GitHub Sharp][GitHub Sharp Dark]": {
       "editorPane.background": "#d6d0d01a",
       "sideBarSectionHeader.border": "#D3D3D3",
    }
}

See Multiple languages specific editor settings