const mix = require('laravel-mix');
const ipv4 = require('internal-ip').v4.sync();

const mixBuildName = function (str) {
    if (/resources_assets_js_pages_(.*?)_vue/.test(str)) {
        str = /resources_assets_js_pages_(.*?)_vue/.exec(str)[1];
    }
    return str.replace(/_/g, '/');
}

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel applications. By default, we are compiling the CSS
 | file for the application as well as bundling up all the JS files.
 |
 */

mix
    .copy('resources/assets/statics/public', 'public')
    .js('resources/assets/js/app.js', 'public/js')
    .sass('resources/assets/sass/app.scss', 'public/css')
    .webpackConfig({
        output: {
            chunkFilename: function ({chunk}) {
                return `js/build/${mixBuildName(chunk.id)}.${mix.inProduction() ? '[hash:8].' : ''}js`
            }
        },
    })
    .options({
        processCssUrls: false,
        hmrOptions: {
            host: ipv4 || 'localhost',
            port: '22222'
        },
    })
    .vue({
        version: 2,
    });
