vscode-css-variables-autocomplete

Simple extension for enabling autocompletion for css-variables from selected files. You can trigger it by typing --.

Be sure that you have one of supported language modes selected in right bottom of your vscode window:

• css
• postcss
• scss
• less

Extension Configuration

Create or modify file .vscode/settings.json. Folder .vscode should be in your workspace root directory.

Minimal configuration file:

{
  "cssVarriablesAutocomplete.files": [ "variables.css" ],
}

Full configuration file:

{
  "cssVarriablesAutocomplete.files": [ "variables.css" ],
  "cssVarriablesAutocomplete.languageModes": [ "css", "postcss" ],
  "cssVarriablesAutocomplete.propertyPrefixes": {
    "font-size": "fs",
    "line-height": "lh",
    "box-shadow": "shadow",
  }
}

This extension contributes the following configuration parameters:

• files: array of paths to files with css variables
• languageModes: specify custom language modes if default 'css' not suits you.
• propertyPrefixes: allows you to suggest only variables with some prefix in name for specified properties. For example with "font-size": "fs" extension will only suggest you variables --fs-big, --fs-small, but not --small.