const mix = require('laravel-mix');
// const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
//
// mix.webpackConfig({
//     plugins: [
//         new BundleAnalyzerPlugin()
//     ]
// });

//We need to define this because 'mix.copy' and 'mix.script' won't listen to the setPublicPath
let publicDir = 'wwwroot/';

mix.browserSync({
    proxy: 'localhost:8000',
    port: 8001,
    files: [
        'wwwroot/css/**/*',
        'resources/views/**/*',
        'resources/lang/**/*',
        'resources/js/**/*',
        'resources/vue/**/*',
    ]
});

mix.options({
    publicPath: 'wwwroot',
    notifications: {
        onSuccess: false
    },
    processCssUrls: false,
});

mix.webpackConfig({
    resolve: {
        alias: {
            '~': __dirname + '/resources/vue'
        }
    }
});

/*
 |--------------------------------------------------------------------------
 | 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/img', publicDir + 'img');

mix.sass('resources/sass/style.scss', 'css/style.css')
    .options({
        // processCssUrls: false,
        // autoprefixer: {
        //     options: {
        //         grid: true,
        //         overrideBrowserslist: [
        //             '> 2%',
        //             'ie 11'
        //         ]
        //     }
        // }
    })
    .sourceMaps(false, 'inline-source-map')
    .version();

mix.js('resources/js/script.js', publicDir + 'js')
    .version();

mix.js('resources/vue/app.js', publicDir + 'js')
    .vue()
    .extract(['@vue', 'vue-router', 'vuex', 'axios', '@babel','@popperjs'])
    .version();