cleanup

package.json

@@ -6,12 +6,12 @@
   "author": "arizzitano",
   "license": "MIT",
   "scripts": {
-    "build": "webpack",
-    "build-docs": "install-self-peers && webpack --config ./webpack.docs.config.js",
+    "build": "NODE_ENV=production webpack",
+    "build-docs": "NODE_ENV=docs && install-self-peers && webpack",
     "lint": "eslint .",
     "prestart": "install-self-peers",
     "poststop": "yarn install",
-    "start": "BABEL_ENV=webpack webpack-dev-server --config ./webpack.dev.config.js --watch"
+    "start": "BABEL_ENV=webpack webpack-dev-server --watch"
   },
   "dependencies": {
     "classnames": "^2.2.5",

src/Button.js

-import React, { Component } from 'react';
-
-export default class Button extends React.Component {
-  render() {
-    return (
-      <button>hello i'm a button</button>
-    );
-  }
-}

src/utils.js

 let lastId = 0;
 
-export const newId = (prefix='id') => {
-  lastId++;
+export const newId = (prefix = 'id') => {
+  lastId += 1;
   return `${prefix}${lastId}`;
 };

webpack.config.js

 const path = require('path');
+const StaticSiteGeneratorPlugin = require('static-site-generator-webpack-plugin');
 
-module.exports = {
+const env = process.env.NODE_ENV || 'dev';
+
+const base = {
   devtool: 'source-map',
+  entry: {
+    main: path.resolve('./docs/App.js'),
+  },
+  output: {
+    filename: 'bundle.js',
+    path: path.resolve('./docs'),
+    libraryTarget: 'umd',
+  },
+  module: {
+    rules: [
+      {
+        test: /\.js$/,
+        exclude: /(node_modules|bower_components)/,
+        use: [
+          {
+            loader: 'babel-loader',
+            options: {
+              presets: ['env', 'babili'],
+            },
+          },
+          { loader: 'source-map-loader' },
+        ],
+      },
+    ],
+  },
+};
+
+const additionalConfig = {
+  // dev runs the doc site locally.
+  dev: {
+    devServer: {
+      contentBase: path.resolve('./docs'),
+      historyApiFallback: true,
+      stats: {
+        chunks: false,
+      },
+    },
+    node: {
+      fs: 'empty',
+    },
+    module: {
+      loaders: [
+        {
+          test: /\.(js|jsx)$/,
+          exclude: /node_modules/,
+          loaders: [
+            'babel-loader?cacheDirectory',
+          ],
+        },
+      ],
+    },
+  },
+  // docs builds the doc site for production.
+  docs: {
+    plugins: [
+      new StaticSiteGeneratorPlugin('main', [
+        '/',
+        '/header/',
+        '/inputs/',
+      ], {}),
+    ],
+    module: {
+      rules: [
+        {
+          test: /\.js$/,
+          exclude: /(node_modules|bower_components)/,
+          use: {
+            loader: 'babel-loader',
+            options: {
+              presets: ['env'],
+            },
+          },
+        },
+      ],
+    },
+  },
+  // production builds the library for external consumption
+  production: {
     entry: path.resolve('./src/index.js'),
     output: {
       path: path.resolve('./dist'),
@@ -41,21 +122,7 @@ module.exports = {
         root: ['React', 'addons', 'CSSTransitionGroup'],
       },
     }],
-  module: {
-    rules: [
-      {
-        test: /\.js$/,
-        exclude: /(node_modules|bower_components)/,
-        use: [
-          {
-            loader: 'babel-loader',
-            options: {
-              presets: ['env', 'babili'],
-            },
-          },
-          { loader: 'source-map-loader' },
-        ]
-      },
-    ],
   },
 };
+
+module.exports = Object.assign(base, additionalConfig[env]);

webpack.dev.config.js

-const path = require('path');
-
-module.exports = {
-  devtool: 'source-map',
-  devServer: {
-    contentBase: path.resolve('./docs'),
-    historyApiFallback: true,
-    stats: {
-      chunks: false
-    }
-  },
-  entry: {
-    main: './docs/App.js'
-  },
-  node: {
-    fs: 'empty'
-  },
-  output: {
-    filename: 'bundle.js',
-    path: path.resolve('./docs'),
-    libraryTarget: 'umd'
-  },
-  module: {
-    loaders: [
-      {
-        test: /\.(js|jsx)$/,
-        exclude: /node_modules/,
-        loaders: [
-          'babel-loader?cacheDirectory',
-        ],
-      },
-    ],
-  },
-};

webpack.docs.config.js

-const path = require('path');
-const StaticSiteGeneratorPlugin = require('static-site-generator-webpack-plugin');
-
-module.exports = {
-  entry: {
-    main: path.resolve('./docs/App.js'),
-  },
-  output: {
-    path: path.resolve('./docs'),
-    filename: 'bundle.js',
-    libraryTarget: 'umd',
-  },
-  plugins: [
-    new StaticSiteGeneratorPlugin('main', [
-      '/',
-      '/header/',
-      '/inputs/',
-    ], {}),
-  ],
-  module: {
-    rules: [
-      {
-        test: /\.js$/,
-        exclude: /(node_modules|bower_components)/,
-        use: {
-          loader: 'babel-loader',
-          options: {
-            presets: ['env'],
-          },
-        },
-      },
-    ],
-  },
-};
\ No newline at end of file