Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save railsstudent/4772f17af4a56a41e5e8988bc074e864 to your computer and use it in GitHub Desktop.
Save railsstudent/4772f17af4a56a41e5e8988bc074e864 to your computer and use it in GitHub Desktop.
Use PurgeCSS with Tailwind & Gulp (Inspired by @andrewdelprete)
const atimport = require("postcss-import");
const { dest, src, task } = require("gulp");
const postcss = require("gulp-postcss");
const purgecss = require("@fullhuman/postcss-purgecss");
const tailwindcss = require("tailwindcss");
const TAILWIND_CONFIG = "./tailwind.config.js";
const SOURCE_STYLESHEET = "./src/style.css";
const DESTINATION_STYLESHEET = "./build/style.css";
task("css", () =>
src(SOURCE_STYLESHEET)
.pipe(
postcss([
atimport(),
tailwindcss(TAILWIND_CONFIG),
...(process.env.NODE_ENV === "production"
? [
purgecss({
content: ["**/*.html"],
defaultExtractor: content =>
content.match(/[\w-/:]+(?<!:)/g) || []
})
]
: [])
])
)
.pipe(dest(DESTINATION_STYLESHEET))
);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment