Laravel Mix Config for pushing chunked assets to an S3 CDN

webpack.mix.js

let mix = require('laravel-mix');
// require('laravel-mix-bundle-analyzer');
const s3Plugin = require('webpack-s3-plugin');

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

mix.js('resources/assets/js/app.js', 'public/js').vue()
    .sass('resources/assets/sass/app.scss', 'public/css')
    .options({
        processCssUrls: false
    });

if (mix.inProduction()) {
    const ASSET_URL = process.env.ASSET_URL + "/";
    let webpackPlugins = [];
    if (process.env.UPLOAD_S3) {
        // upload assets to S3 bucket
        // ID, secret, and bucket name all set in environment variables
        webpackPlugins = [
            new s3Plugin({
                include: /.*\.(css|js)$/,
                s3Options: {
                    accessKeyId: process.env.AWS_ACCESS_KEY_ID,
                    secretAccessKey: process.env.AWS_SECRET_ACCESS_KEY,
                    region: 'us-east-1',
                },
                s3UploadOptions: {
                    Bucket: process.env.ASSETS_S3_BUCKET,
                    CacheControl: 'public, max-age=31536000',
                    ACL: 'private'
                },
                basePath: 'app',
                directory: 'public'
            })
        ]
    }
    mix.webpackConfig(webpack => {
        return {
            plugins: [
                ...webpackPlugins,
                new webpack.DefinePlugin({
                    "process.env.ASSET_PATH": JSON.stringify(ASSET_URL)
                })
            ],
            output: {
                publicPath: ASSET_URL
            }
        }
    });
    mix.version();
} else {
    mix.browserSync({
        proxy: 'www.vomo.test',
        open: false,
        socket: {
            domain: 'http://192.168.1.103:3000'
        }
    });
}

// if (mix.isWatching()) {
//     mix.bundleAnalyzer();
// }