const path = require('path');
const mix = require('laravel-mix');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');

require('laravel-mix-polyfill');
mix.webpackConfig({
    resolve: {
        alias: {
            '@': path.resolve('resources/assets')
        }
    },
    plugins: [
        new CleanWebpackPlugin({
            cleanOnceBeforeBuildPatterns: [
                'css/*',
                'js/*',
                'images/*',
                'fonts/*',
                'assets/*'
            ]
        })
    ],
});

let assetDir = 'assets';
mix.options({
    fileLoaderDirs: {
        images: `${assetDir}/images`,
        fonts: `${assetDir}/fonts`
    },
    postCss: [
        require('postcss-discard-comments')({
            removeAll: true
        })
    ]
});

mix.js('resources/js/app.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css')
    .vue()
    .polyfill({
        corejs: 3,
        enabled: true,
        useBuiltIns: "usage",
        targets: { "firefox": "50", "ie": 11 }
    });

// * FontAwesome compile
mix.sass('node_modules/@fortawesome/fontawesome-free/scss/fontawesome.scss', 'public/css')
    .sass('node_modules/@fortawesome/fontawesome-free/scss/brands.scss', 'public/css')
    .sass('node_modules/@fortawesome/fontawesome-free/scss/regular.scss', 'public/css')
    .sass('node_modules/@fortawesome/fontawesome-free/scss/solid.scss', 'public/css');