feat: update Bolt build config to add support for extending / modifying the default Webpack config generated

Author: sghoweri

packages/build-tools/create-webpack-config.js

@@ -13,6 +13,7 @@ const resolve = require('resolve');
 const CopyWebpackPlugin = require('copy-webpack-plugin');
 const WriteFilePlugin = require('write-file-webpack-plugin');
 const npmSass = require('npm-sass');
+const merge = require('webpack-merge');
 const SassDocPlugin = require('@bolt/sassdoc-webpack-plugin');
 const { getConfig } = require('./utils/config-store');
 const { boltWebpackProgress } = require('./utils/webpack-helpers');
@@ -237,7 +238,7 @@ async function createWebpackConfig(buildConfig) {
     },
   ];
 
-  const webpackConfig = {
+  let webpackConfig = {
     target: 'web',
     entry: await buildWebpackEntry(),
     output: {
@@ -497,6 +498,23 @@ async function createWebpackConfig(buildConfig) {
     };
   }
 
+  // Simple Configuration
+  // The easiest way to tweak the Bolt webpack config is by providing an object to the configureWebpack option in the `.boltrc.js` config:
+
+  // // .boltrc.js
+  // module.exports = {
+  //   configureWebpack: {
+  //     plugins: [
+  //       new MyAwesomeWebpackPlugin()
+  //     ]
+  //   }
+  // }
+  // The object will be merged into the final webpack config using webpack-merge.
+
+  if (config.configureWebpack) {
+    webpackConfig = merge(webpackConfig, config.configureWebpack);
+  }
+
   return webpackConfig;
 }
 

packages/build-tools/utils/config.schema.yml

@@ -225,6 +225,9 @@
         - none
         - console
         - cli
+    configureWebpack:
+      type: object
+      description: 'Passing in an object will merge any config customizations with the default Bolt Webpack config (via <a href="https://github.com/survivejs/webpack-merge" target="_blank">webpack-merge</a>).'
     configFileUsed:
       type: string
       description: The filepath to the `.boltrc` file used to load config. Programatically added to config.