• Press F1 and select Extensions: Install Extensions.
• Search for and select css sorting.

See the extension installation guide for details.

• Autosave trigger.
• Full text mode: Press F1 and run the command named CSS Sorting: Run.
• Range mode: Select full css class and open context menu to CSS Sorting: Format.
• File mode: in vscode left file tree, select styles folder or css/less/scss file, then open context menu to CSS Sorting: Files/File.

• CSS
• Less
• SCSS

You can override the default and user settings for individual projects. Just add an CSSSorting object to the settings.json file.

For example:

{
  "CSSSorting.config": {
    "order": [
      "custom-properties",
      "dollar-variables",
      "declarations",
      "at-rules",
      "rules"
    ],
    "properties-order": ["display", "position", "top", "right", "bottom", "left"],
    "unspecified-properties-position": "bottom",
    "ignore": ["**/node_modules/**", "**/dist/**"]
  }
}

Use npm with vsce, don't use pnpm that will be cause error in build.

This software is released under the terms of the MIT license.