Allow full control over webpack config.

If a function is returned from the '.storybook/webpack.config.js' then it will kick in 'full-control mode'. The function accepts the baseConfig from storybook and the dev can modify it with full control. This is necessary for more custom webpack configurations.

dist/server/config.js

@@ -39,6 +39,12 @@ exports.default = function (baseConfig, configDir) {
   }
 
   var customConfig = require(customConfigPath);
+
+  if (typeof customConfig === 'function') {
+    logger.info('=> Loading custom webpack config (full-control mode).');
+    return customConfig(config);
+  }
+
   logger.info('=> Loading custom webpack config.');
 
   return (0, _extends3.default)({}, customConfig, config, {

docs/configure_storybook.md

@@ -17,6 +17,7 @@ You can configure React Storybook in different ways. We'll discuss them here.
   * [Add Custom CSS Loaders](#add-custom-css-loaders)
   * [Customizing The UI](#customizing-the-ui)
   * [Other Configurations](#other-configurations)
+  * [Full Control](#full-control)
 * [Load Custom HTML Head Content](#load-custom-html-head-content)
 
 
@@ -193,6 +194,10 @@ module.exports = {
 
 We allow you to use almost all [Webpack configurations](https://webpack.github.io/docs/configuration.html). So, you can customize as you wish.
 
+### Full Control
+
+For very custom configuration needs, or if you'd like to take full control over the webpack config, [see this guide](/docs/webpack_full_control_mode.md).
+
 ## Custom Babel Config
 
 Storybook will first search for a `.babelrc` inside the storybook config directory, and then at your project's root. If it doesn't find either of these files, it will use its default configuration instead.

docs/webpack_full_control_mode.md

@@ -0,0 +1,38 @@
+# Taking Full Control of the Webpack Config
+
+There are so many so many configuration options. We give a sane config by default, but sometimes you just need to take the wheel.
+
+> Beware: You will be in full control of the webpack config and could easily break storybook. We have the important bits listed below.
+
+## Full Control Mode
+
+You'll need to add a `webpack.config.js` file to your config folder (`.storybook/` by default.
+
+In the `webpack.config.js`, return a **Function** instead of an object. The function will receive our base config. You can make modifications to it or create a brand new one. The function just needs to return a valid webpack config.
+
+Example:
+
+ ```js
+// .storybook/webpack.config.js
+
+// Export a function. Accept the base config as the only param.
+module.exports = (storybookBaseConfig) => {
+  // Make whatever fine-grained changes you need
+  storybookBaseConfig.module = { ... }
+
+  // Return the altered config
+  return storybookBaseConfig;
+};
+ ```
+
+Pretty straightforward :)
+
+## Important Parts
+
+The following sections of the config could break storybook if deleted:
+
+- `config.entry`
+- `config.output`
+- `config.plugins[new webpack.HotModuleReplacementPlugin()]`
+
+You've been warned.

src/server/config.js

@@ -54,6 +54,12 @@ export default function (baseConfig, configDir) {
   }
 
   const customConfig = require(customConfigPath);
+
+  if (typeof customConfig === 'function') {
+    logger.info('=> Loading custom webpack config (full-control mode).');
+    return customConfig(config);
+  }
+
   logger.info('=> Loading custom webpack config.');
 
   return {