根据class类名自动生成style样式 - vite版本

webpack版本请看这篇文章 点击这里 ,webpack版本这篇文章介绍更加详细。

接下来和我一起看看插件怎么使用吧。

1. 安装

npm i vite-plugin-style-from-class

2. 配置

2.1 在src文件夹下新建styles.css文件,并在main.js中导入

2.2 在vue.config.js中使用插件, 添加如下代码

import styleFromClass from "vite-plugin-style-from-class";

styleFromClass({
    fileType: ["vue"],
    dirPath: "",    
    cssFilePath: ""
})

 

3. 使用 

<div class="c:red ta:center fs:red">文字</div>