@ 编译/ vite- plugin

已编译的 Vite 插件 .

安装

npm install @compiled/vite-plugin @compiled/react

使用量

将插件添加到您的 vite.config.ts数字 :

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import compiled from '@compiled/vite-plugin';

export default defineConfig({
  plugins: [compiled(), react()],
});

重要内容: 编译插件必须放置 在此之前 反应插件。 它被默认通过 pre 点菜.

配置

共同选项 :

compiled({
  extract: true, // Extract CSS to file (production only)
  importReact: false, // Set false when using automatic JSX runtime
  ssr: false, // Enable SSR mode
  sortAtRules: true, // Sort media queries for extraction
  sortShorthand: true, // Sort shorthand properties for extraction
});

CSS 提取器

启用 CSS 提取用于生产 :

export default defineConfig({
  plugins: [
    compiled({
      extract: true, // Generates compiled.css
    }),
    react(),
  ],
});

提取剂在开发中自动被禁用,以达到最佳高血压.

更多信息

详细的文件和实例可以是: 在文档网站上找到。 。 。 .