Further simplify and consolidate webpack config

package.json

@@ -10,7 +10,7 @@
     "clean": "rimraf ./dist/ ./static/assets/",
     "compile": "rimraf ./dist/ && electron-webpack --bail --display-error-details --env.minify=false",
     "fetch": "rimraf ./static/assets/ && mkdirp ./static/assets/ && node ./scripts/fetchMediaLibraryAssets.js",
-    "dist": "npm run fetch && npm run compile && electron-builder",
+    "dist": "npm run fetch && npm run compile -p && electron-builder",
     "dist:dir": "npm run dist -- --dir -c.compression=store -c.mac.identity=null",
     "lint": "eslint --cache --color --ext .jsx,.js ."
   },

webpack.main.additions.js

@@ -1,64 +1,11 @@
-const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
+const path = require('path');
-const webpack = require('webpack');
 
-const isProduction = (process.env.NODE_ENV === 'production');
+const makeConfig = require('./webpack.makeConfig.js');
 
-console.log(`Main module building in production mode? ${isProduction}`);
+module.exports = makeConfig({
-
+    name: 'main',
-const babelOptions = {
+    useReact: false,
-    // Explicitly disable babelrc so we don't catch various config
+    babelPaths: [
-    // in much lower dependencies.
+        path.resolve(__dirname, 'src', 'main')
-    babelrc: false,
-    plugins: [
-        '@babel/plugin-syntax-dynamic-import',
-        '@babel/plugin-transform-async-to-generator',
-        '@babel/plugin-proposal-object-rest-spread'
-    ],
-    presets: [
-        ['@babel/preset-env', {targets: {electron: '3.0.2'}}]
     ]
-};
+});
-
-module.exports = {
-    mode: isProduction ? 'production' : 'development',
-    module: {
-        rules: [
-            // Override the *.js defaults from electron-webpack
-            // The test/include/exclude must match the defaults exactly for webpack-merge to do the override
-            {
-                test: /\.js$/,
-                exclude: /(node_modules|bower_components)/,
-                loader: 'babel-loader',
-                options: babelOptions
-            },
-            {
-                test: /.js$/,
-                loader: 'source-map-loader',
-                enforce: 'pre'
-            }
-        ]
-    },
-    optimization: {
-        // Use `--env.minify=false` to disable the UglifyJsPlugin instance automatically injected by electron-webpack.
-        // Otherwise it will do double-duty with this one.
-        minimizer: [
-            new UglifyJsPlugin({
-                cache: true,
-                parallel: true,
-                sourceMap: true, // disable this if UglifyJSPlugin takes too long and/or runs out of memory
-                uglifyOptions: {
-                    compress: isProduction ? {} : false,
-                    mangle: isProduction
-                }
-            })
-        ]
-    },
-    plugins: [
-        new webpack.SourceMapDevToolPlugin({
-            filename: '[file].map'
-        })
-    ],
-    resolve: {
-        symlinks: false
-    }
-};

webpack.makeConfig.js

@@ -0,0 +1,85 @@
+const webpack = require('webpack');
+const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
+
+const isProduction = (process.env.NODE_ENV === 'production');
+
+const makeConfig = function (options) {
+    // eslint-disable-next-line no-console
+    console.log(`Module "${options.name}" building in production mode? ${isProduction}`);
+
+    const babelOptions = {
+        // Explicitly disable babelrc so we don't catch various config in much lower dependencies.
+        babelrc: false,
+        plugins: [
+            '@babel/plugin-syntax-dynamic-import',
+            '@babel/plugin-transform-async-to-generator',
+            '@babel/plugin-proposal-object-rest-spread'
+        ],
+        presets: [
+            ['@babel/preset-env', {targets: {electron: '3.0.2'}}]
+        ]
+    };
+
+    const sourceFileTest = options.useReact ? /\.jsx?$/ : /\.js$/;
+    if (options.useReact) {
+        babelOptions.presets = babelOptions.presets.concat('@babel/preset-react');
+        babelOptions.plugins.push(['react-intl', {
+            messagesDir: './translations/messages/'
+        }]);
+    }
+
+    return {
+        devtool: 'cheap-module-eval-source-map',
+        mode: isProduction ? 'production' : 'development',
+        module: {
+            rules: [
+                // Override the *.js defaults from electron-webpack
+                // The test/include/exclude must match the defaults exactly for webpack-merge to do the override
+                {
+                    test: /\.js$/,
+                    exclude: /(node_modules|bower_components)/,
+                    loader: 'babel-loader',
+                    options: babelOptions
+                },
+                // Add a new rule for the other files we want to run through babel
+                {
+                    test: sourceFileTest,
+                    include: options.babelPaths,
+                    loader: 'babel-loader',
+                    options: babelOptions
+                },
+                {
+                    test: sourceFileTest,
+                    loader: 'source-map-loader',
+                    enforce: 'pre'
+                }
+            ]
+        },
+        optimization: {
+            // Use `--env.minify=false` to disable the UglifyJsPlugin instance automatically injected by
+            // electron-webpack. Otherwise it will do double-duty with this one.
+            minimizer: isProduction ? [
+                new UglifyJsPlugin({
+                    cache: true,
+                    parallel: true,
+                    sourceMap: true, // disable this if UglifyJSPlugin takes too long and/or runs out of memory
+                    uglifyOptions: {
+                        compress: isProduction ? {} : false,
+                        mangle: isProduction
+                    }
+                })
+            ] : []
+        },
+        plugins: [
+            new webpack.SourceMapDevToolPlugin({
+                filename: '[file].map'
+            })
+        ].concat(options.plugins || []),
+        resolve: {
+            cacheWithContext: false,
+            symlinks: false
+        }
+    };
+};
+
+module.exports = makeConfig;

webpack.renderer.additions.js

@@ -1,87 +1,19 @@
 const path = require('path');
 
 const CopyWebpackPlugin = require('copy-webpack-plugin');
-const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
-const webpack = require('webpack');
 
-const isProduction = (process.env.NODE_ENV === 'production');
+const makeConfig = require('./webpack.makeConfig.js');
 
-console.log(`Renderer module building in production mode? ${isProduction}`);
+module.exports = makeConfig({
-
+    name: 'renderer',
-const babelOptions = {
+    useReact: true,
-    // Explicitly disable babelrc so we don't catch various config
+    babelPaths: [
-    // in much lower dependencies.
+        path.resolve(__dirname, 'src', 'renderer')
-    babelrc: false,
-    plugins: [
-        '@babel/plugin-syntax-dynamic-import',
-        '@babel/plugin-transform-async-to-generator',
-        '@babel/plugin-proposal-object-rest-spread',
-        ['react-intl', {
-            messagesDir: './translations/messages/'
-        }]
     ],
-    presets: [
+    plugins: [
-        ['@babel/preset-env', {targets: {electron: '3.0.2'}}],
+        new CopyWebpackPlugin([{
-        '@babel/preset-react'
+            from: path.resolve(__dirname, 'node_modules', 'scratch-gui', 'dist', 'static'),
+            to: 'static'
+        }])
     ]
-};
+});
-
-module.exports = {
-    mode: isProduction ? 'production' : 'development',
-    module: {
-        rules: [
-            // Override the *.js defaults from electron-webpack
-            // The test/include/exclude must match the defaults exactly for webpack-merge to do the override
-            {
-                test: /\.js$/,
-                exclude: /(node_modules|bower_components)/,
-                loader: 'babel-loader',
-                options: babelOptions
-            },
-            // Add a new rule for the other files we want to run through babel
-            {
-                test: /\.jsx?$/,
-                include: [
-                    path.resolve(__dirname, 'src', 'renderer'),
-                    /node_modules[\\/]scratch-[^\\/]+[\\/]src/
-                ],
-                loader: 'babel-loader',
-                options: babelOptions
-            },
-            {
-                test: /.jsx?$/,
-                loader: 'source-map-loader',
-                enforce: 'pre'
-            }
-        ]
-    },
-    optimization: {
-        // Use `--env.minify=false` to disable the UglifyJsPlugin instance automatically injected by electron-webpack.
-        // Otherwise it will do double-duty with this one.
-        minimizer: [
-            new UglifyJsPlugin({
-                cache: true,
-                parallel: true,
-                sourceMap: true, // disable this if UglifyJSPlugin takes too long and/or runs out of memory
-                uglifyOptions: {
-                    compress: isProduction ? {} : false,
-                    mangle: isProduction
-                }
-            })
-        ]
-    },
-    plugins: [
-        new CopyWebpackPlugin([
-            {
-                from: path.resolve(__dirname, 'node_modules', 'scratch-gui', 'dist', 'static'),
-                to: 'static'
-            }
-        ]),
-        new webpack.SourceMapDevToolPlugin({
-            filename: '[file].map'
-        })
-    ],
-    resolve: {
-        symlinks: false
-    }
-};