Add support for stylelint as formatter

[fisker]

Like ESLint do https://github.com/microsoft/vscode-eslint#release-notes

Formatter support: ESLint can now be used as a formatter. To enable this feature use the eslint.format.enable setting.

[ux-engineer]

Yes please, came by this need myself yesterday.

[ux-engineer]

How many rules are there in Stylelint, and how many of them have autofix logic built for them?

[BPScott]

@ux-engineer https://stylelint.io/user-guide/rules is your big list of rules that are built into stylelint. Autofixable ones are denoted with an "(Autofixable)".

[ux-engineer]

Ah, sorry - someone mentioned earlier there would be many that don't have autofix... It seems he was incorrect, or meant about an another project which extends Stylelint.

Great work you've done. Now, if we would get Stylelint as a proper formatter for VS Code, that would be super! :)

Also to support Vue Single-Page Component's style blocks: #19

PS. In Vue ecosystem, I already got to ditch Prettier now that ESLint acts as an formatter...but still needing to find proper setup with Stylelint to format SCSS.

[GollyJer]

Came looking for this today as well. Thought I had configured something wrong. 👍

[francois-pasquier]

Here is my workaround with multiCommand:

keybindings.json

[
    {
        "key": "ctrl+shift+i",
        "command": "extension.multiCommand.execute",
        "args": {
            "command": "multiCommand.formatJavascript"
        },
        "when": "editorLangId == javascript && editorTextFocus && !editorReadonly"
    },
]

settings.json

    "eslint.format.enable": true,
    "[javascript]": {
        "editor.defaultFormatter": "dbaeumer.vscode-eslint",
    },
    "multiCommand.commands": [
        {
            "command": "multiCommand.formatJavascript",
            "sequence": [
                "editor.action.formatDocument",
                "stylelint.executeAutofix"
            ]
        }
    ]

[kanlukasz]

My solution - just add specific shortcuts

	{
		"key": "alt+shift+f",
		"command": "stylelint.executeAutofix",
		"when": "editorTextFocus && editorLangId == 'css'"
	},
	{
		"key": "alt+shift+f",
		"command": "stylelint.executeAutofix",
		"when": "editorTextFocus && editorLangId == 'scss'"
	},
	{
		"key": "alt+shift+f",
		"command": "stylelint.executeAutofix",
		"when": "editorTextFocus && editorLangId == 'less'"
	}

[jeddy3]

Is this resolved by pull request #18 or is enabling stylelint as a formatter something else?

[GollyJer]

@jeddy3

This is separate from #18. Here we're talking about the ability to format without having to save.

Here is the command in vscode.

[mcdado]

I think to achieve this goal, this is the way: https://code.visualstudio.com/blogs/2016/11/15/formatters-best-practices

[mbacalan]

I'm surprised this is still pending as it would improve the extension by large. Would love to see this support added for all the lazy developers out there that rely on formatting on save.

[adalinesimonian]

An update for anyone looking forward to this functionality: I merged my implementation of the formatter from #200 a little over a week ago. However, I had reservations about how thoroughly the code I wrote was being tested, so I didn't want to cut a release yet at the time.

Over the past week, I've worked on improving testing for this extension, creating a Jest runner for testing VS Code extensions and revamping the testing and CI setup for this extension. Funny enough, this work paid off and identified a bug in the formatter that wasn't caught before, which I've now patched.

I'm looking forward to pushing out a new release of this extension with the document formatting support soon. I'm done for the day but I'll share once there's an update.

[adalinesimonian]

v0.87.1 has been released with document formatting support! 🚀🎉

[yukulele]

It doesn't work for scss