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

const purgecss = require('@fullhuman/postcss-purgecss')

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

PostCSS API の使用

const purgecss = require('@fullhuman/postcss-purgecss')
postcss([
  purgecss({
    content: ['./src/**/*.html']
  })
])

PostCSS新しいウィンドウで開く のドキュメントで、使用環境の例を参照してください。

オプション

PurgeCSS のすべてのオプションは、プラグインで使用できます。以下は、使用可能な主なオプションの型定義です。完全なリストについては、PurgeCSS ドキュメント Web サイト新しいウィンドウで開く を参照してください。

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>;