Kevin Powell - Community•16mo ago

custom properties / css var auto complete

https://marketplace.visualstudio.com/items?itemName=phoenisx.cssvar Read the docs for customization, and how to use (might need postCSS node_mods)

CSS Var Complete - Visual Studio Marketplace

Extension for Visual Studio Code - Intellisense support for CSS Variables

1 Reply

WillsterJohnson•16mo ago

slightly more limited than that extension, but for Svelte or SvelteKit projects, you can use the setting svelte.plugin.css.globals to get this kind of behavior across every *.svelte file in your project. Below is an example, which is the value I use;

// settings.json
{
  ...
  "svelte.plugin.css.globals": "./assets/*.css,./app/assets/*.css,./src/assets/*.css",
  ...
}

// settings.json
{
  ...
  "svelte.plugin.css.globals": "./assets/*.css,./app/assets/*.css,./src/assets/*.css",
  ...
}

As long as it's a string of comma separated paths or glob paths relative to the workspace root, it can be anything you like. It may even do sass/less/<preprocessor> if the files in those locations are set up to be transpiled (not sure, needs testing).

Gaming

Programming

custom properties / css var auto complete