Package Exports
- @erbelion/vite-plugin-laravel-purgecss
Readme
vite-plugin-laravel-purgecss
A Vite plugin that integrates PurgeCSS with Laravel 11/10/9 template assets (currently updated to laravel/laravel@11.0.7).
It purges assets only in production mode (yarn build/npm run build).
Installation
yarn
yarn add @erbelion/vite-plugin-laravel-purgecssnpm
npm i @erbelion/vite-plugin-laravel-purgecssUsage
Use plugin in your Vite config (vite.config.ts)
import purge from '@erbelion/vite-plugin-laravel-purgecss'
export default {
plugins: [
laravel(...),
purge({
templates: ['blade']
})
]
}
Options
| Parameter | Type | Description |
|---|---|---|
| templates? | string[] |
List of ready paths to be processed by PurgeCSS. See below. |
| paths? | string[] |
List of paths to be processed by PurgeCSS. |
| safelist? | UserDefinedSafelist |
Check available safelist options in PurgeCSS docs. |
| extractors? | Extractors[] |
Check available extractors options in PurgeCSS docs. |
Templates
| Parameter | Path to be processed |
|---|---|
| blade | resources/views/**/*.blade.php |
| svelte | resources/{js,views}/**/*.svelte |
| vue | resources/{js,views}/**/*.vue |
| react | resources/{js,views}/**/*.{tsx,ts,jsx,js,html} |
| angular | resources/{js,views}/**/*.html |
You may also provide custom paths via paths option.
Other examples
Vue via template option:
purge({
templates: ['blade', 'vue']
})Via custom path:
purge({
paths: ['resources/views/**/*.blade.php']
})Via custom paths + always keep #bruh, .nice-button and h1 styling:
purge({
paths: [
'resources/views/**/*.blade.php',
'resources/{js,views}/**/*.vue'
],
safelist: ['bruh', 'nice-button', 'h1']
})Example config with fix for escaped prefixes (sm:, lg:, etc.):
purge({
paths: [
'resources/views/**/*.blade.php',
'resources/{js,views}/**/*.vue'
],
extractors: [
{
extractor: (content) => {
return content.match(/[a-z-_:\/]+/g) || []
},
extensions: ['php', 'vue', 'html']
}
]
})Tutorial
https://github.com/erbelion/tutorial-vite-plugin-laravel-purgecss