webpack.config.js

const webpack = require('webpack');
const merge = require('webpack-merge');
const path = require('path');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const ReplaceInFileWebpackPlugin = require('replace-in-file-webpack-plugin');


module.exports = (env, argv) => {

    var isDevServer = argv.mode === undefined;

    if (isDevServer && __dirname.indexOf(" ") !== -1) {
        throw new Error("Space in __dirname not allowed: " + __dirname);
    }

    const sharedSettings = {
        entry: {
            'main': path.resolve(__dirname, 'App', 'boot.ts')
        },
        resolve: {
            extensions: [".ts", ".js", ".json"]
        },
        module: {
            rules: [
                {
                    //ts to js
                    test: /\.ts$/,
                    use: 'ts-loader'
                },
                {
                    //html to js
                    test: /\.html$/,
                    use: 'html-loader'
                },
                {
                    //css to js to inline style append
                    test: /\.css$/,
                    use: ['style-loader', 'css-loader']
                },
                {
                    //less to css to js to inline style append
                    test: /\.less$/,
                    use: ['style-loader', 'css-loader', 'less-loader']
                }
            ]
        }        
    }

    const developmentSettings = {
        mode: 'development',
        output: {
            path: path.resolve(__dirname, "dist"),
            publicPath: "/",
            filename: 'main.js'
        },
        devServer: {
            contentBase: './dist',
            historyApiFallback: true
        },
        plugins: [
            new CopyWebpackPlugin([
                {
                    from: path.resolve(__dirname, '*.html'),
                    to: path.resolve(__dirname, 'dist', '[name].[ext]')
                }
            ])            
        ]
    };

    const productionSettings = {
        mode: "production",
        plugins: [
            new CopyWebpackPlugin([
                {
                    from: path.resolve(__dirname, '*.html'),
                    to: path.resolve(__dirname, 'dist', '[name].[ext]')
                }
            ]),
            new ReplaceInFileWebpackPlugin(
                [
                    {
                        dir: path.join(__dirname, 'dist'),
                        test: /\.html$/,
                        rules: [
                            {
                                search: /((\?|\&)v\=)(.+?)(?=\"|\'|\&)/ig,
                                replace: (match) => {
                                    return match.toString().substr(0, 3) +
                                        +new Date();
                                }
                            }
                        ]
                    }
                ]
            )         
        ]
    }
    //to merge sharedSettings
    var dev = Object.assign({}, sharedSettings, developmentSettings);
    var prod = Object.assign({}, sharedSettings, productionSettings);


    //return dev or prod to webpack depending on --mode config (webpack-dev-server: argv.mode = undefined)
    return argv.mode === "development" || argv.mode === undefined ? dev : prod;
};