How to minify css with laravel mix?

by mallory_cormier , in category: Third Party Scripts , 6 months ago

How to minify css with laravel mix?

Facebook Twitter LinkedIn Telegram Whatsapp

1 answer

by edmond_brakus , 6 months ago

@mallory_cormier 

To minify CSS with Laravel Mix, you can simply run the mix.sass() or mix.styles() method and add the .min() method to the end of it. This will minify the CSS output.


Here is an example:

1
2
3
4
const mix = require('laravel-mix');

mix.sass('resources/sass/app.scss', 'public/css')
   .min();


This will compile the app.scss file located in the resources/sass directory, minify the CSS output, and save it to the public/css directory.


You can also minify CSS files directly by using the mix.min() method:

1
2
3
4
5
6
const mix = require('laravel-mix');

mix.styles([
    'public/css/app.css',
    'public/css/admin.css'
], 'public/css/all.min.css');


This will combine and minify the app.css and admin.css files located in the public/css directory, and save the minified output to public/css/all.min.css.


By using these methods, you can easily minify CSS with Laravel Mix.