PurgeCSS中文文档网PurgeCSS中文文档网
首页
文档
API参考
GitHub
首页
文档
API参考
GitHub
  • PurgeCSS

    • 关于PurgeCSS
    • 快速开始
    • 配置
    • 命令行接口
    • 编程API
    • 安全列表
    • 提取器
  • 插件

    • PostCSS插件
    • Webpack插件
    • Gulp插件
    • Grunt插件
    • Gatsby插件
  • 指南

    • Vue
    • React
    • Next.js
    • Nuxt.js
    • Razzle
    • WordPress
    • Hugo
  • 比较
  • 常见问题

    • 如何与CSS模块一起使用
    • 如何与Ant Design一起使用

PostCSS

注意

如果你正在使用 PostCSS 7,请安装 @fullhuman/postcss-purgecss 3.0.0:npm i -D @fullhuman/postcss-purgecss@3.0.0。 从 4.0 版本开始,仅兼容 PostCSS >=8。

安装

npm i -D @fullhuman/postcss-purgecss postcss

使用

在 postcss.config.js 中:

import { purgeCSSPlugin } from '@fullhuman/postcss-purgecss';

module.exports = {
  plugins: [
    purgeCSSPlugin({
      content: ['./**/*.html']
    })
  ]
}

使用 PostCSS API:

import { purgeCSSPlugin } from '@fullhuman/postcss-purgecss';

postcss([
  purgeCSSPlugin({
    content: ['./src/**/*.html']
  })
])

请参阅 PostCSS 文档,了解适用于你的环境的示例。

选项

所有 PurgeCSS 的选项都可以与插件一起使用。 下面是主要可用选项的类型定义。完整列表请访问 PurgeCSS 文档网站。

export interface UserDefinedOptions {
  content?: Array<string | RawContent>;
  contentFunction?: (sourceFile: string) => Array<string | RawContent>;
  defaultExtractor?: ExtractorFunction;
  extractors?: Array<Extractors>;
  fontFace?: boolean;
  keyframes?: boolean;
  output?: string;
  rejected?: boolean;
  stdin?: boolean;
  stdout?: boolean;
  variables?: boolean;
  safelist?: UserDefinedSafelist;
  blocklist?: StringRegExpArray;
}

interface RawContent {
  extension: string
  raw: string
}

interface RawCSS {
  raw: string
}

type StringRegExpArray = Array<RegExp | string>;
Edit this page
Next
Webpack插件