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一起使用

Gulp

安装

npm i -D gulp-purgecss
npm install --save-dev gulp-purgecss

使用

默认情况下,purgecss 会输出删除了未使用选择器的源 CSS:

const gulp = require('gulp')
const purgecss = require('gulp-purgecss')

gulp.task('purgecss', () => {
    return gulp.src('src/**/*.css')
        .pipe(purgecss({
            content: ['src/**/*.html']
        }))
        .pipe(gulp.dest('build/css'))
})

通过设置 rejected 选项,你可以"反转"输出,只列出被删除的选择器:

const gulp = require('gulp')
const rename = require('gulp-rename')
const purgecss = require('gulp-purgecss')

gulp.task('purgecss-rejected', () => {
    return gulp.src('src/**/*.css')
        .pipe(rename({
            suffix: '.rejected'
        }))
        .pipe(purgecss({
            content: ['src/**/*.html'],
            rejected: true
        }))
        .pipe(gulp.dest('build/css'))
})
Edit this page
Prev
Webpack插件
Next
Grunt插件