css-class-intellisense
Html/Vue/Jsx/PHP id/class attribute completion
Features
- Html/Vue/Jsx/PHP id/class attribute completion (Include Vue/Jsx imported CSS/SCSS/LESS file)
- Jump to definition or reference
- Rename (May conflict with other extensions, cannot currently be resolved, use with care)
- Limited language support for web extensions (issues)
Usage
Global
Specify global CSS in settings.json:
{
"cssci.globalCSSFiles": ["https://getbootstrap.com/docs/5.2/dist/css/bootstrap.css", "../main.scss"]
}
Embed
<!doctype html>
<html>
<head>
<style>
.hello {
}
</style>
</head>
<body>
<div class="hello"></div>
</body>
</html>
<template>
<div class="hello"></div>
</template>
<style>
.hello {
}
</style>
Link
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="https://getbootstrap.com/docs/5.2/dist/css/bootstrap.css" />
</head>
<body>
<div class="accordion"></div>
</body>
</html>
Import
import "./App.scss";
export default function App() {
return <div className="hello"></div>;
}
<template>
<div class="hello"></div>
</template>
<script>
import "./App.css";
</script>
| |
