Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>CSS Class HelperNew to Visual Studio Code? Get it now.
CSS Class Helper

CSS Class Helper

aki77

|
22 installs
| (0) | Free
CSS Class Autocomplete with Definition Jump
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

CSS Class Helper

CSS Class Helper is a VSCode extension that provides CSS class autocomplete with definition jump.

Features

  • CSS class autocomplete
  • Definition jump
  • Emmet completion

Demo

Extension Settings

This extension contributes the following settings:

  • cssClassHelper.includeGlobPattern: List of glob patterns to find css files. (default: "*/.{css,scss}")
  • cssClassHelper.excludeGlobPattern: List of glob patterns to exclude css files. (default: "{node_modules,vendor,tmp}/**")
  • cssClassHelper.enableEmmetCompletion: Enable emmet completion. (default: true)
  • cssClassHelper.langClassAttributePatterns: List of language id and class attribute patterns. (default: see below)
{
  "html": ["class=[\"'][^\"']+$"],
  "haml": ["^\\s*%?(?:\\w+)?(?:\\.[\\w-_]+)+$", "class:\\s*[\"'][^\"']+$"]
}

Commands

This extension provides the following commands:

  • cssClassHelper.reload: Reloads the CSS class definitions.

Supported CSS file formats

  • .css
  • .scss

Known Issues

  • Automatic reloading does not occur when CSS is updated.
  • Class names that do not match /[\w_-]+/ are not targeted.
  • Contact us
  • Jobs
  • Privacy
  • Terms of use
  • Trademarks
© 2023 Microsoft