vite-plugin-autocss-generator v1.0.0-beta.15

vite-plugin-autocss 基于vite的HMR机制，根据页面class自动生成css文件

更新记录

如何使用

+

安装依赖

pnpm add vite-plugin-autocss-generator -D
  or
npm i vite-plugin-autocss-generator -D
  or
yarn add vite-plugin-autocss-generator -D

+

### vite 配置

import vitePluginAutocss from 'vite-plugin-autocss-generator'
export default defineConfig({
  // ... other config settings 
  plugins:[
    vitePluginAutocss()
  ]
})

在项目入口文件中引入 生成的css

import '@/style/auto.css'

生成代码提示文件

将会在项目根目录生成 autocss-use-snippets.css 作为代码提示文件

npx autocss-gen-snippets
 or
yarn autocss-gen-snippets

配置项

请复制项目根目录中 node_modules/vite-plugin-autocss-generator/ 目录下的配置文件 autocss.config.js 到项目根目录，重命名为 .autocss.config.js 文件

自动生成配置文件【可省略手动复制配置文件的步骤】

将会在项目根目录生成 .autocss.config.js 配置文件

npx autocss-init-config
  or
yarn autocss-init-config

规则说明与进阶使用

感谢以下开源仓库提供

• css-generator-plugin