0.2.3 • Published 6 months ago

@erbelion/vite-plugin-laravel-purgecss v0.2.3

Weekly downloads
-
License
MIT
Repository
github
Last release
6 months ago

vite-plugin-laravel-purgecss

Get package from npm Downloads Downloads views

A Vite plugin that integrates PurgeCSS with Laravel 10/9 template assets (currently updated to laravel/laravel@10.2.9).

It purges assets only in production mode (yarn build/npm run build).

Installation

yarn

yarn add -D @erbelion/vite-plugin-laravel-purgecss

npm

npm i -D @erbelion/vite-plugin-laravel-purgecss

Usage

Use plugin in your Vite config (vite.config.ts)

import purge from '@erbelion/vite-plugin-laravel-purgecss'

export default {
    plugins: [
        laravel(...),
        purge({
            templates: ['blade']
        })
    ]
}

See more examples

Options

ParameterTypeDescription
templates?string[]List of ready paths to be processed by PurgeCSS. See below.
paths?string[]List of paths to be processed by PurgeCSS.
safelist?UserDefinedSafelistCheck available safelist options in PurgeCSS docs.
extractors?Extractors[]Check available extractors options in PurgeCSS docs.

Templates

ParameterPath to be processed
bladeresources/views/**/*.blade.php
svelteresources/{js,views}/**/*.svelte
vueresources/{js,views}/**/*.vue
reactresources/{js,views}/**/*.{tsx,ts,jsx,js,html}
angularresources/{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

See also

vite-plugin-sveltekit-purgecss

0.2.3

6 months ago

0.2.1

11 months ago

0.2.0

11 months ago

0.1.4

1 year ago

0.2.2

11 months ago

0.1.2

1 year ago

0.1.1

2 years ago

0.1.0

2 years ago

0.0.8

2 years ago

0.0.7

2 years ago

0.0.6

2 years ago

0.0.5

2 years ago

0.0.4

2 years ago

0.0.3

2 years ago

0.0.2

2 years ago

0.0.1

2 years ago