Skip to content

Instantly share code, notes, and snippets.

@devellopah
Forked from andrewdelprete/webpack.mix.js
Created March 14, 2018 20:04
Show Gist options
  • Save devellopah/15d1de55c9a38b1fc26ca11ad844d80c to your computer and use it in GitHub Desktop.
Save devellopah/15d1de55c9a38b1fc26ca11ad844d80c to your computer and use it in GitHub Desktop.
Laravel Mix: Tailwind CSS + PurgeCSS Example
let mix = require("laravel-mix");
let tailwindcss = require("tailwindcss");
let glob = require("glob-all");
let PurgecssPlugin = require("purgecss-webpack-plugin");
/**
* Custom PurgeCSS Extractor
* https://github.com/FullHuman/purgecss
* https://github.com/FullHuman/purgecss-webpack-plugin
*/
class TailwindExtractor {
static extract(content) {
return content.match(/[A-z0-9-:\/]+/g);
}
}
mix.postCss("./src/styles.css", "public/css", [tailwindcss("./tailwind.js")]);
mix.webpackConfig({
plugins: [
new PurgecssPlugin({
paths: glob.sync([
path.join(__dirname, "resources/views/**/*.blade.php"),
path.join(__dirname, "resources/assets/js/**/*.vue")
]),
extractors: [
{
extractor: TailwindExtractor,
extensions: ["html", "js", "php", "vue"]
}
]
})
]
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment