PostCSS 集成 #

🧪 实验性的。

⚠️ 因为一些 PostCSS API 的限制，我们并不鼓励使用这个包。我们为每一个专用工具提供了 最佳的适配 以获得最佳的开发体验和性能。这个插件应当作为你集成 Windi CSS 的最后一个选择。

安装 #

从 NPM 安装 postcss-windicss

npm i -D postcss-windicss

在你的项目根目录下创建 postcss.config.js

module.exports = {
  plugins: {
    'postcss-windicss': { /* ... */ },
  },
}

将 @windicss 添加到你的 CSS 入口：

/* main.css */
@windicss;

在你的项目根目录下创建 windi.config.js / windi.config.ts 并写入下面的配置

import { defineConfig } from 'windicss/helpers'

export default defineConfig({
  extract: {
    include: ['src/**/*.{html,vue,jsx,tsx,svelte}'],
  },
  /* ... */
})

用得开心~