diff --git a/packages/build-tools/create-webpack-config.js b/packages/build-tools/create-webpack-config.js index 3320582e8d..5c41691bc5 100644 --- a/packages/build-tools/create-webpack-config.js +++ b/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; } diff --git a/packages/build-tools/package.json b/packages/build-tools/package.json index 6501c59c9f..9b9e2b309f 100644 --- a/packages/build-tools/package.json +++ b/packages/build-tools/package.json @@ -88,6 +88,7 @@ "webpack-hot-middleware": "^2.24.3", "webpack-manifest-plugin": "^2.0.4", "webpack": "4.29.0", + "webpack-merge": "^4.2.1", "write-file-webpack-plugin": "^4.5.0", "yaml-loader": "^0.5.0" }, diff --git a/packages/build-tools/utils/config.schema.yml b/packages/build-tools/utils/config.schema.yml index b80d4b7a5c..b0f4b5fc47 100644 --- a/packages/build-tools/utils/config.schema.yml +++ b/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 webpack-merge).' configFileUsed: type: string description: The filepath to the `.boltrc` file used to load config. Programatically added to config. diff --git a/yarn.lock b/yarn.lock index 60e22ea5da..5eb53817c1 100644 --- a/yarn.lock +++ b/yarn.lock @@ -18111,6 +18111,13 @@ webpack-manifest-plugin@^2.0.4: lodash ">=3.5 <5" tapable "^1.0.0" +webpack-merge@^4.2.1: + version "4.2.1" + resolved "https://registry.npmjs.org/webpack-merge/-/webpack-merge-4.2.1.tgz#5e923cf802ea2ace4fd5af1d3247368a633489b4" + integrity sha512-4p8WQyS98bUJcCvFMbdGZyZmsKuWjWVnVHnAS3FFg0HDaRVrPbkivx2RYCre8UiemD67RsiFFLfn4JhLAin8Vw== + dependencies: + lodash "^4.17.5" + webpack-sources@^1.0.1, webpack-sources@^1.1.0, webpack-sources@^1.3.0: version "1.3.0" resolved "https://registry.npmjs.org/webpack-sources/-/webpack-sources-1.3.0.tgz#2a28dcb9f1f45fe960d8f1493252b5ee6530fa85"