vuejs / vetur

Vue tooling for VS Code.
https://vuejs.github.io/vetur/
MIT License
5.75k stars 593 forks source link

Is it possible to configure the HTML/JS/CSS sections of a .vue file differently? #2493

Open fenomas opened 3 years ago

fenomas commented 3 years ago

Info

Problem

The use case here is when you want (for example) smaller tab widths in HTML than in CSS/JS. In prettier, apparently the only way to do this is by specifying overrides according to file type, but this doesn't work when done in vetur's prettier config.

Is there any way of achieving this?

Reproducible Case

Below is a sample /.vscode/settings.json, that tries to set tabWidth to 4 generally, but to 2 for HTML files. When used with vetur, the overrides appear to be ignored (even if one specifies *.vue, though of course that wouldn't be particularly useful here).

{
    "vetur.format.defaultFormatterOptions": {
        "prettier": {
            "tabWidth": 4,
            "overrides": [
                {
                    "files": "*.html",
                    "options": {
                        "tabWidth": 2
                    }
                },
            ]
        },
    }
}
yoyo930021 commented 3 years ago

It's not work now, but It's possible to do it.