Merge branch 'development' into feature/instant/tell-amount-available

1 files changed, 34 insertions, 4 deletions

diff --git a/packages/dev-tools-pages/webpack.config.js b/packages/dev-tools-pages/webpack.config.js
index 6dfcf74e7..640297770 100644
--- a/packages/dev-tools-pages/webpack.config.js
+++ b/packages/dev-tools-pages/webpack.config.js
@@ -1,13 +1,24 @@
 const path = require('path');
 const webpack = require('webpack');
 const TerserPlugin = require('terser-webpack-plugin');
+const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
+const HtmlWebpackPlugin = require('html-webpack-plugin');
 const childProcess = require('child_process');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+const CleanWebpackPlugin = require('clean-webpack-plugin');
+
+const pages = require('./pages');
 
 const config = {
-    entry: ['./ts/index.tsx'],
+    entry: {
+        compiler: './ts/pages/compiler.tsx',
+        cov: './ts/pages/cov.tsx',
+        profiler: './ts/pages/profiler.tsx',
+        trace: './ts/pages/trace.tsx',
+    },
     output: {
         path: path.join(__dirname, '/public'),
-        filename: 'bundle.js',
+        filename: 'bundle-[name].js',
         chunkFilename: 'bundle-[name].js',
         publicPath: '/',
     },
@@ -48,6 +59,10 @@ const config = {
                 test: /\.css$/,
                 loaders: ['style-loader', 'css-loader'],
             },
+            {
+                test: /\.svg$/,
+                loaders: ['react-svg-loader'],
+            },
         ],
     },
     optimization: {
@@ -60,21 +75,36 @@ const config = {
     devServer: {
         port: 3572,
         disableHostCheck: true,
+        overlay: true,
+        historyApiFallback: true,
     },
 };
 
 module.exports = (_env, argv) => {
-    let plugins = [];
+    let plugins = [
+        new CleanWebpackPlugin('public'),
+        ...pages.map(p => new HtmlWebpackPlugin(p)),
+        new CopyWebpackPlugin([
+            { from: 'assets/crawl.html', to: 'index.html' },
+            { from: 'assets/fonts', to: 'fonts' },
+            { from: 'assets/images', to: 'images' },
+        ]),
+    ];
     if (argv.mode === 'development') {
         config.mode = 'development';
     } else {
         config.mode = 'production';
+        config.output.filename = 'bundle-[name].[chunkhash].js';
+        config.output.chunkFilename = 'bundle-[name].[chunkhash].js';
+
         plugins = plugins.concat([
             new webpack.DefinePlugin({
                 'process.env': {
-                    NODE_ENV: JSON.stringify(process.env.NODE_ENV),
+                    NODE_ENV: JSON.stringify(process.env.NODE_ENV || config.mode),
                 },
             }),
+            // commented out to check the bundle when needed
+            //new BundleAnalyzerPlugin(),
         ]);
     }
     console.log('i ｢atl｣: Mode: ', config.mode);