Vite plugin for CssTs - compile-time CSS class management
npm install vite-plugin-cssts.cssts 文件和 中的 css {} 语法,按需生成原子类 CSS
bash
1. 安装(运行时依赖 cssts 会自动安装)
npm install vite-plugin-cssts -D
`
`javascript
// 2. vite.config.js - 零配置!
import cssTsPlugin from 'vite-plugin-cssts'
import vue from '@vitejs/plugin-vue'
export default {
plugins: [cssTsPlugin(), vue()]
}
`
就这样! 现在可以使用 css { } 语法了。
---
✅ 功能亮点
| 功能 | 说明 |
|------|------|
| 🚀 零配置 | 安装即用,自动生成类型定义 |
| 📝 IDE 提示 | 输入原子类时自动补全 |
| 🎯 按需生成 | 只生成实际使用的 CSS |
| 🔥 HMR 支持 | 文件修改后自动热更新 |
| 📦 体积优化 | 编译器不进入生产构建 |
---
📁 支持的文件类型
| 文件类型 | 支持 css {} 语法 | 说明 |
|---------|-------------------|------|
| .cssts 文件 | ✅ 支持 | 独立样式文件 |
| .vue
> 注意:插件会自动将