Split JS bundle into vendor and app

client/build/index.html

@@ -14,6 +14,7 @@
       <div id="app"></div>
     </div>
 
+    <script src="vendors.js"></script>
     <script src="app.js"></script>
   </body>
 </html>

client/build/terminal.html

@@ -14,6 +14,7 @@
       <div id="app"></div>
     </div>
 
+    <script src="vendors.js"></script>
     <script src="terminal-app.js"></script>
   </body>
 </html>

client/server.js

@@ -19,7 +19,7 @@ var app = express();
 
 
 // Serve application file depending on environment
-app.get(/(app|terminal-app).js/, function(req, res) {
+app.get(/(app|terminal-app|vendors).js/, function(req, res) {
   var filename = req.originalUrl;
   if (process.env.NODE_ENV === 'production') {
     res.sendFile(__dirname + '/build' + filename);

client/webpack.local.config.js

@@ -32,7 +32,9 @@ module.exports = {
       './app/scripts/terminal-main',
       'webpack-dev-server/client?http://localhost:4041',
       'webpack/hot/only-dev-server'
-    ]
+    ],
+    vendors: ['classnames', 'd3', 'dagre', 'flux', 'immutable',
+      'lodash', 'page', 'react', 'react-dom', 'react-motion']
   },
 
   // This will not actually create a app.js file in ./build. It is used
@@ -45,12 +47,17 @@ module.exports = {
 
   // Necessary plugins for hot load
   plugins: [
+    new webpack.optimize.CommonsChunkPlugin('vendors', 'vendors.js'),
     new webpack.HotModuleReplacementPlugin(),
     new webpack.NoErrorsPlugin()
   ],
 
   // Transform source code using Babel and React Hot Loader
   module: {
+    include: [
+      path.resolve(__dirname, 'app/scripts')
+    ],
+
     preLoaders: [
       {
         test: /\.js$/,

client/webpack.production.config.js

@@ -18,7 +18,9 @@ module.exports = {
 
   entry: {
     app: './app/scripts/main',
-    'terminal-app': './app/scripts/terminal-main'
+    'terminal-app': './app/scripts/terminal-main',
+    vendors: ['classnames', 'd3', 'dagre', 'flux', 'immutable',
+      'lodash', 'page', 'react', 'react-dom', 'react-motion']
   },
 
   output: {
@@ -70,6 +72,7 @@ module.exports = {
 
   plugins: [
     new webpack.DefinePlugin(GLOBALS),
+    new webpack.optimize.CommonsChunkPlugin('vendors', 'vendors.js'),
     new webpack.optimize.UglifyJsPlugin({
       compress: {
         warnings: false