Laravel Mix Complete Tutorial - FreeCodeBlog

After installed laravel you will get laravel mix files into project root folder. In this tutorial I will explain you all about laravel mix. so waste your time, start to read laravel mix complete tutorial.

Before reading this laravel mix tutorial you need to install laravel. If you don't know how to install laravel then read how to install any kind of laravel version tutorial. We will see some laravel mix file and information after installed laravel.

1. Laravel Mix In Package File.

You will see laravel mix package in laravel package.json file. You can change laravel mix version from laravel package.json file. you need to update package files after changed laravel mix version.

"laravel-mix": "^6.0.6",

2. Laravel Mix Webpack Config Js File.

We will see some laravel mix information in webpack config js file. We will see resolve path resources js file. you can change resolve path according to your project requirement.

const path = require('path');

module.exports = {
    resolve: {
        alias: {
            '@': path.resolve('resources/js'),
        },
    },
};

3. Laravel Mix Webpack Mix Js File.

We will see some laravel mix information in webpack config js file. We will see resolve path resources js file. you can change resolve path according to your project requirement.

const mix = require('laravel-mix');
/*
 | Vue + Tailwind Css
 */

mix.js('resources/js/app.js', 'public/js')
    .vue()
    .postCss('resources/css/app.css', 'public/css', [
        require('postcss-import'),
        require('tailwindcss'),
        require('autoprefixer'),
    ])
    .webpackConfig(require('./webpack.config'));
if (mix.inProduction()) {
    mix.version();
}

Thanks.