Combine webpack configs to build everything at once

package.json

@@ -4,12 +4,8 @@
   "author": "Dessalines <tyhou13@gmx.com>",
   "license": "AGPL-3.0",
   "scripts": {
-    "build:client:dev": "webpack --env platform=client --mode=development",
+    "build:dev": "webpack --mode=development",
-    "build:client:prod": "webpack --env platform=client --mode=production",
+    "build:prod": "webpack --mode=production",
-    "build:dev": "yarn run build:server:dev && yarn run build:client:dev",
-    "build:prod": "yarn run build:server:prod && yarn run build:client:prod",
-    "build:server:dev": "webpack --env platform=server --mode=development",
-    "build:server:prod": "webpack --env platform=server --mode=production",
     "clean": "yarn run rimraf dist",
     "dev": "nodemon --watch ./src/shared/components -e ts,tsx,css,scss --exec yarn run start",
     "lint": "tsc --noEmit && eslint --report-unused-disable-directives --ext .js,.ts,.tsx src",
@@ -81,6 +77,7 @@
     "nodemon": "^2.0.6",
     "prettier": "^2.1.2",
     "rimraf": "^3.0.2",
+    "run-node-webpack-plugin": "^1.3.0",
     "sass-loader": "^10.0.4",
     "sortpack": "^2.1.9",
     "style-loader": "^2.0.0",

webpack.config.js

@@ -1,8 +1,8 @@
+const webpack = require('webpack');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 const nodeExternals = require('webpack-node-externals');
 const CopyPlugin = require('copy-webpack-plugin');
-const path = require('path');
+const { merge } = require('lodash');
-const webpack = require('webpack');
 
 const banner = `
   hash:[contentHash], chunkhash:[chunkhash], name:[name], filebase:[base], query:[query], file:[file]
@@ -11,73 +11,90 @@ const banner = `
   @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL v3.0
   `;
 
-module.exports = function (env, _) {
+const base = {
-  const platform = env.platform || 'server';
+  output: {
+    filename: 'js/server.js',
+    publicPath: '/',
+  },
+  resolve: {
+    extensions: ['.js', '.jsx', '.ts', '.tsx'],
+  },
+  performance: {
+    hints: false,
+  },
+  module: {
+    rules: [
+      {
+        test: /\.(scss|css)$/i,
+        use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'],
+      },
+      {
+        test: /\.(js|jsx|tsx|ts)$/, // All ts and tsx files will be process by
+        exclude: /node_modules/, // ignore node_modules
+        loader: 'babel-loader',
+      },
+      // Due to some weird babel issue: https://github.com/webpack/webpack/issues/11467
+      {
+        test: /\.m?js/,
+        resolve: {
+          fullySpecified: false,
+        },
+      },
+    ],
+  },
+  plugins: [
+    new MiniCssExtractPlugin({
+      filename: 'styles/styles.css',
+    }),
+    new CopyPlugin({
+      patterns: [{ from: './src/assets', to: './assets' }],
+    }),
+    new webpack.BannerPlugin({
+      banner,
+    }),
+  ],
+};
 
-  const base = {
+const createServerConfig = (env, mode) => {
-    // mode is set by package.json flags
+  const config = merge({}, base, {
-    entry: './src/server/index.tsx', // Point to main file
+    mode,
+    entry: './src/server/index.tsx',
     output: {
       filename: 'js/server.js',
-      publicPath: '/',
     },
-    resolve: {
+    target: 'node',
-      extensions: ['.js', '.jsx', '.ts', '.tsx'],
+    externals: [nodeExternals(), 'inferno-helmet'],
-    },
+  });
-    performance: {
-      hints: false,
-    },
-    module: {
-      rules: [
-        {
-          test: /\.(scss|css)$/i,
-          use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'],
-        },
-        {
-          test: /\.(js|jsx|tsx|ts)$/, // All ts and tsx files will be process by
-          exclude: /node_modules/, // ignore node_modules
-          loader: 'babel-loader',
-        },
-        // Due to some weird babel issue: https://github.com/webpack/webpack/issues/11467
-        {
-          test: /\.m?js/,
-          resolve: {
-            fullySpecified: false,
-          },
-        },
-      ],
-    },
-    devServer: {
-      host: '0.0.0.0',
-      contentBase: 'src/',
-      historyApiFallback: true,
-    },
-    plugins: [
-      new MiniCssExtractPlugin({
-        filename: 'styles/styles.css',
-      }),
-      new CopyPlugin({
-        patterns: [{ from: './src/assets', to: './assets' }],
-      }),
-      new webpack.BannerPlugin({
-        banner,
-      }),
-    ],
-    cache: {
-      type: 'filesystem',
-      name: platform,
-    },
-  };
 
-  // server-specific configuration
+  if (mode === 'development') {
-  if (platform === 'server') {
+    config.cache = {
-    base.target = 'node';
+      type: 'filesystem',
-    base.externals = [nodeExternals(), 'inferno-helmet'];
+      name: 'server',
+    };
   }
-  // client-specific configurations
+
-  if (platform === 'client') {
+  return config;
-    base.entry = './src/client/index.tsx';
-    base.output.filename = 'js/client.js';
-  }
-  return base;
 };
+const createClientConfig = (env, mode) => {
+  const config = merge({}, base, {
+    mode,
+    entry: './src/client/index.tsx',
+    output: {
+      filename: 'js/client.js',
+    },
+  });
+
+  if (mode === 'development') {
+    config.cache = {
+      type: 'filesystem',
+      name: 'client',
+    };
+  }
+
+  return config;
+};
+
+module.exports = (env, properties) => [
+  createServerConfig(env, properties.mode || 'development'),
+  createClientConfig(env, properties.mode || 'development'),
+];

yarn.lock

@@ -2368,7 +2368,7 @@ chalk@^1.1.1:
     strip-ansi "^3.0.0"
     supports-color "^2.0.0"
 
-chalk@^2.0.0, chalk@^2.0.1, chalk@^2.3.0, chalk@^2.4.2:
+chalk@^2.0.0, chalk@^2.0.1, chalk@^2.4.2:
   version "2.4.2"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.2.tgz#cd42541677a54333cf541a49108c1432b44c9424"
   integrity sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==
@@ -3321,15 +3321,6 @@ end-of-stream@^1.0.0, end-of-stream@^1.1.0:
   dependencies:
     once "^1.4.0"
 
-enhanced-resolve@^4.0.0:
-  version "4.3.0"
-  resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-4.3.0.tgz#3b806f3bfafc1ec7de69551ef93cca46c1704126"
-  integrity sha512-3e87LvavsdxyoCfGusJnrZ5G8SLPOFeHSNpZI/ATL9a5leXo2k0w6MKnbqhdBad9qTobSfB20Ld7UmgoNbAZkQ==
-  dependencies:
-    graceful-fs "^4.1.2"
-    memory-fs "^0.5.0"
-    tapable "^1.0.0"
-
 enhanced-resolve@^5.3.0:
   version "5.3.1"
   resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.3.1.tgz#3f988d0d7775bdc2d96ede321dc81f8249492f57"
@@ -5787,7 +5778,7 @@ loader-runner@^4.1.0:
   resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-4.1.0.tgz#f70bc0c29edbabdf2043e7ee73ccc3fe1c96b42d"
   integrity sha512-oR4lB4WvwFoC70ocraKhn5nkKSs23t57h9udUgw8o0iH8hMXeEoRuUgfcvgUwAJ1ZpRqBvcou4N2SMvM1DwMrA==
 
-loader-utils@^1.0.2, loader-utils@^1.4.0:
+loader-utils@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.4.0.tgz#c579b5e34cb34b1a74edc6c1fb36bfa371d5a613"
   integrity sha512-qH0WSMBtn/oHuwjy/NucEgbx5dbxxnxup9s4PVXJUDHZBQY+s0NWA9rJf53RBnQZxfch7euUui7hpoAPvALZdA==
@@ -6127,14 +6118,6 @@ memory-fs@^0.4.1:
     errno "^0.1.3"
     readable-stream "^2.0.1"
 
-memory-fs@^0.5.0:
-  version "0.5.0"
-  resolved "https://registry.yarnpkg.com/memory-fs/-/memory-fs-0.5.0.tgz#324c01288b88652966d161db77838720845a8e3c"
-  integrity sha512-jA0rdU5KoQMC0e6ppoNRtpp6vjFq6+NY7r8hywnC7V+1Xj/MtHwGIbB1QaK/dunyjWteJzmkpd7ooeWg10T7GA==
-  dependencies:
-    errno "^0.1.3"
-    readable-stream "^2.0.1"
-
 meow@^3.7.0:
   version "3.7.0"
   resolved "https://registry.yarnpkg.com/meow/-/meow-3.7.0.tgz#72cb668b425228290abbfa856892587308a801fb"
@@ -6190,7 +6173,7 @@ micromatch@^3.1.10, micromatch@^3.1.4:
     snapdragon "^0.8.1"
     to-regex "^3.0.2"
 
-micromatch@^4.0.0, micromatch@^4.0.2:
+micromatch@^4.0.2:
   version "4.0.2"
   resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-4.0.2.tgz#4fcb0999bf9fbc2fcbdd212f6d629b9a56c39259"
   integrity sha512-y7FpHSbMUMoyPbYUSzO6PaZ6FyRnQOpHuKwbo1G+Knck95XVU4QAiKdGEnj5wwoS7PlOgthX/09u5iFJ+aYf5Q==
@@ -8283,6 +8266,11 @@ rimraf@^3.0.2:
   dependencies:
     glob "^7.1.3"
 
+run-node-webpack-plugin@^1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/run-node-webpack-plugin/-/run-node-webpack-plugin-1.3.0.tgz#c019294c59116e26d5e5f017f5318a65e4479524"
+  integrity sha512-XKWOasBxjS00iFQrXQmSh2/aT/T9BWFcTm0XVdeHPqgnhvv2J7Ug0WON6HBBHj+B9S90N2bciBrc1LpoCTsI3A==
+
 run-parallel@^1.1.9:
   version "1.1.9"
   resolved "https://registry.yarnpkg.com/run-parallel/-/run-parallel-1.1.9.tgz#c9dd3a7cf9f4b2c4b6244e173a6ed866e61dd679"
@@ -9148,11 +9136,6 @@ table@^5.2.3:
     slice-ansi "^2.1.0"
     string-width "^3.0.0"
 
-tapable@^1.0.0:
-  version "1.1.3"
-  resolved "https://registry.yarnpkg.com/tapable/-/tapable-1.1.3.tgz#a1fccc06b58db61fd7a45da2da44f5f3a3e67ba2"
-  integrity sha512-4WK/bYZmj8xLr+HUCODHGF1ZFzsYffasLUgEiMBY4fgtltdO6B4WJtlSbPaDTLpYTcGVwM2qLnFTICEcNxs3kA==
-
 tapable@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/tapable/-/tapable-2.0.0.tgz#a49c3d6a8a2bb606e7db372b82904c970d537a08"
@@ -9359,17 +9342,6 @@ trim-newlines@^1.0.0:
   dependencies:
     glob "^7.1.2"
 
-ts-loader@^8.0.7:
-  version "8.0.7"
-  resolved "https://registry.yarnpkg.com/ts-loader/-/ts-loader-8.0.7.tgz#9ce70db5b3906cc9143a09c54ff5247d102ea974"
-  integrity sha512-ooa4wxlZ9TOXaJ/iVyZlWsim79Ul4KyifSwyT2hOrbQA6NZJypsLOE198o8Ko+JV+ZHnMArvWcl4AnRqpCU/Mw==
-  dependencies:
-    chalk "^2.3.0"
-    enhanced-resolve "^4.0.0"
-    loader-utils "^1.0.2"
-    micromatch "^4.0.0"
-    semver "^6.0.0"
-
 tsconfig-paths@^3.9.0:
   version "3.9.0"
   resolved "https://registry.yarnpkg.com/tsconfig-paths/-/tsconfig-paths-3.9.0.tgz#098547a6c4448807e8fcb8eae081064ee9a3c90b"