PurgeCSS
PurgeCSS 是什么?
在构建网站时,你很可能会使用像 Bootstrap、Materializecss、Foundation 等 CSS 框架。但你只会使用框架的一小部分,而大量未使用的 CSS 样式会被包含进来。
这就是 PurgeCSS 发挥作用的地方。PurgeCSS 会分析你的内容和 CSS 文件,然后将 CSS 文件中使用的选择器与内容文件中的选择器进行匹配。它会移除未使用的选择器,从而得到更小的 CSS 文件。
赞助商 🥰
文档
你可以在这个网站上找到 PurgeCSS 的文档。
目录
PurgeCSS
插件
指南
入门
安装
npm install purgecss --save-dev
使用
import { PurgeCSS } from "purgecss";
const purgeCSSResults = await new PurgeCSS().purge({
content: ["**/*.html"],
css: ["**/*.css"],
});
包
这个仓库是一个使用 Lerna 管理的 monorepo。这意味着我们实际上从同一个代码库向 npm 发布了多个包,包括:
包 | 版本 | 描述 |
---|---|---|
purgecss | PurgeCSS 的核心 | |
postcss-purgecss | PurgeCSS 的 PostCSS 插件 | |
purgecss-webpack-plugin | PurgeCSS 的 Webpack 插件 | |
gulp-purgecss | PurgeCSS 的 Gulp 插件 | |
grunt-purgecss | PurgeCSS 的 Grunt 插件 | |
rollup-plugin-purgecss | PurgeCSS 的 Rollup 插件 | |
purgecss-from-html | PurgeCSS 的 Html 提取器 | |
purgecss-from-pug | PurgeCSS 的 Pug 提取器 | |
purgecss-with-wordpress | WordPress 的安全列表项集合 | |
vue-cli-plugin-purgecss | PurgeCSS 的 Vue CLI 插件 |