Few things to know about Laravel Mix

Jeffrey Way’s Laravel Mix package provides a fluent API for constructing webpack build steps for your Laravel application utilizing a variety of CSS and JavaScript pre-processors. To put it another way, Mix makes compiling and minifying your application’s CSS and JavaScript files a breeze.

You must first confirm that Node.js and NPM are installed on your machine before running the Mix

Minification is the process of minimizing code and markup in the web pages and script files. It’s one of the most common techniques for reducing website load times and bandwidth utilization. Minification dramatically improves site speed and accessibility, directly translating into a better user experience. It’s also useful for people who are browsing your website using a limited data plan and want to reduce their bandwidth usage while surfing the web.

Installing Node & Laravel Mix

node -v && npm -v && npm install

Running Mix

Because Mix is a configuration layer on top of webpack, all you have to do to run your Mix tasks is run one of the NPM scripts included in the default Laravel package.json file. All of your application’s CSS and JavaScript assets will be compiled and stored in the public directory when you execute the dev or production scripts.

// Run all Mix tasks…
npm run dev

// Run all Mix tasks and minify output…
npm run prod

Mix will display OS alerts when compiling if they are available, giving you fast feedback on whether the compilation was successful or not. There may be times, though, when you might prefer to turn off these notifications. Triggering Mix on your production server is one such example. The disableNotifications function can be used to turn off notifications.

mix.disableNotifications();

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store