PurgeCSS

CLI

PurgeCSS 可透過命令列介面使用。你可以單獨使用 CLI 或搭配設定檔使用。

安裝

你可以將 PurgeCSS 安裝為開發環境依賴項，並使用 npx 使用 CLI，或者也可以將 PurgeCSS 全域安裝

npm i -g purgecss

使用

若要查看 CLI 可用的選項：purgecss --help

Usage: purgecss --css <css...> --content <content...> [options]

Remove unused css selectors

Options:
  -V, --version                        output the version number
  -con, --content <files...>           glob of content files
  -css, --css <files...>               glob of css files
  -c, --config <path>                  path to the configuration file
  -o, --output <path>                  file path directory to write purged css files to
  -font, --font-face                   option to remove unused font-faces
  -keyframes, --keyframes              option to remove unused keyframes
  -v, --variables                      option to remove unused variables
  -rejected, --rejected                option to output rejected selectors
  -rejected-css, --rejected-css        option to output rejected css
  -s, --safelist <list...>             list of classes that should not be removed
  -b, --blocklist <list...>            list of selectors that should be removed
  -k, --skippedContentGlobs <list...>  list of glob patterns for folders/files that should not be scanned
  -h, --help                           display help for command

透過 CLI 可用的選項與透過設定檔可用的選項類似。你也可以搭配設定檔使用 CLI。

--css

purgecss --css css/app.css css/palette.css --content src/index.html

--content

你可以指定要由 PurgeCSS 分析的內容，方法是提供檔案名稱陣列或 glob在新視窗中開啟。這些檔案可以是 HTML、Pug、Blade 等。

purgecss --css css/app.css --content src/index.html src/**/*.js

--config

你可以搭配 設定檔 使用 CLI。搭配設定檔路徑使用 --config 或 -c。

purgecss --config ./purgecss.config.js

--output

預設情況下，CLI 會在主控台中輸出結果。如果你希望以檔案形式傳回 CSS，請指定要將淨化後的 CSS 檔案寫入的目錄。

purgecss --css css/app.css --content src/index.html "src/**/*.js" --output build/css/

--safelist

如果您希望防止 PurgeCSS 移除特定 CSS 選擇器，您可以將其新增至安全清單。

purgecss --css css/app.css --content src/index.html --safelist classnameToSafelist