webpack.config.js

const path = require('path');
const Dotenv = require('dotenv-webpack');
const { VueLoaderPlugin } = require('vue-loader');
const TerserPlugin = require('terser-webpack-plugin');

var entries = require('./webpack-entries');
for (let index in entries) {
  entries[index] = './vue/apps/' + entries[index];
}

module.exports = function (env = {}) {
  const mode = env.local ? "development" : "production";
  const envBuildConfig = new Dotenv(getEnvironmentConfig(env));

  return {
    mode: mode,
    entry: entries,
    output: {
      path: path.resolve(__dirname, '../aodclib/js/vue/'),
      publicPath: '../aodclib/js/vue/',
      filename: '[name].js',
      chunkFilename: mode === 'development' ? '[id].[chunkhash].dev-chunk.js' : '[id].[name].[hash].[chunkhash].chunk.js'
    },
    module: {
      rules: [
        {
          test: /\.vue$/,
          loader: 'vue-loader'
        },
        {
          test: /\.js$/,
          loader: 'babel-loader',
          exclude: /node_modules/,
          options: {
            presets: ['@babel/preset-env'],
            plugins: ["@babel/plugin-transform-runtime"]
          }
        },
        {
          test: /\.css$/i,
          use: ['style-loader', 'css-loader'],
        },
        {
          test: /\.(png|woff|woff2|eot|ttf|svg)$/,
          use: ['file-loader']
        },
        {
          test: /\.s(c|a)ss$/,
          use: [
            'style-loader',
            'css-loader',
            {
              loader: 'sass-loader',
              options: {
                sassOptions: {
                  indentedSyntax: false
                },
              },
            },
          ],
        },
      ]
    },
    plugins: [
      new VueLoaderPlugin(),
      envBuildConfig
    ],
    optimization: {
      minimize: true,
      minimizer: [new TerserPlugin({
        terserOptions: {
          compress: { drop_console: true },
        }
      })],
    },
    devtool: mode === 'development' ? 'eval-source-map' : false,
    resolve: {
      extensions: ['.js', '.vue', '.json'],
      modules: ['node_modules'],
      alias: {
        'vue$': 'vue/dist/vue.esm-bundler.js',
        '@': path.resolve(__dirname, 'apps/')
      }
    },
    devServer: {
      host: 'local.aodoubleclick.com',
      port: 4000,
      hot: true,
      devMiddleware: {
        writeToDisk: true,
      },
      static: {
        directory: path.join(__dirname, '../aodclib/js/vue/')
      }
    }
  };
};

function getEnvironmentConfig(env) {
  let config = {
    path: './vue/environments/.env', // default environment file
    systemvars: true,
    silent: false,
  };
  
  if (env.local) {
    config.path = './vue/environments/.env';
  } else if (env.dev) {
    config.path = './vue/environments/.dev.env';
  } else if (env.release) {
    config.path = './vue/environments/.stg.env';
  } else if (env.production) {
    config.path = './vue/environments/.prod.env';
  }

  return config;
}