Client: add dll support

2 files changed, 51 insertions, 1 deletions

diff --git a/client/config/webpack.common.js b/client/config/webpack.common.js
index 09d6f72b5..223f55c2e 100644
--- a/client/config/webpack.common.js
+++ b/client/config/webpack.common.js
@@ -323,7 +323,7 @@ module.exports = function (options) {
      * See: https://webpack.github.io/docs/configuration.html#node
      */
     node: {
-      global: 'true',
+      global: true,
       crypto: 'empty',
       process: true,
       module: false,
diff --git a/client/config/webpack.dev.js b/client/config/webpack.dev.js
index 054757748..affb20f19 100644
--- a/client/config/webpack.dev.js
+++ b/client/config/webpack.dev.js
@@ -1,10 +1,12 @@
 const helpers = require('./helpers')
 const webpackMerge = require('webpack-merge') // used to merge webpack configs
+const webpackMergeDll = webpackMerge.strategy({plugins: 'replace'})
 const commonConfig = require('./webpack.common.js') // the settings that are common to prod and dev
 
 /**
  * Webpack Plugins
  */
+const AddAssetHtmlPlugin = require('add-asset-html-webpack-plugin')
 const DefinePlugin = require('webpack/lib/DefinePlugin')
 const NamedModulesPlugin = require('webpack/lib/NamedModulesPlugin')
 const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin')
@@ -23,6 +25,8 @@ const METADATA = webpackMerge(commonConfig({env: ENV}).metadata, {
   HMR: HMR
 })
 
+const DllBundlesPlugin = require('webpack-dll-bundles-plugin').DllBundlesPlugin
+
 /**
  * Webpack configuration
  *
@@ -106,6 +110,52 @@ module.exports = function (env) {
         }
       }),
 
+      new DllBundlesPlugin({
+        bundles: {
+          polyfills: [
+            'core-js',
+            {
+              name: 'zone.js',
+              path: 'zone.js/dist/zone.js'
+            },
+            {
+              name: 'zone.js',
+              path: 'zone.js/dist/long-stack-trace-zone.js'
+            },
+            'ts-helpers'
+          ],
+          vendor: [
+            '@angular/platform-browser',
+            '@angular/platform-browser-dynamic',
+            '@angular/core',
+            '@angular/common',
+            '@angular/forms',
+            '@angular/http',
+            '@angular/router',
+            '@angularclass/hmr',
+            'rxjs'
+          ]
+        },
+        dllDir: helpers.root('dll'),
+        webpackConfig: webpackMergeDll(commonConfig({env: ENV}), {
+          devtool: 'cheap-module-source-map',
+          plugins: []
+        })
+      }),
+
+      /**
+       * Plugin: AddAssetHtmlPlugin
+       * Description: Adds the given JS or CSS file to the files
+       * Webpack knows about, and put it into the list of assets
+       * html-webpack-plugin injects into the generated html.
+       *
+       * See: https://github.com/SimenB/add-asset-html-webpack-plugin
+       */
+      new AddAssetHtmlPlugin([
+        { filepath: helpers.root(`dll/${DllBundlesPlugin.resolveFile('polyfills')}`) },
+        { filepath: helpers.root(`dll/${DllBundlesPlugin.resolveFile('vendor')}`) }
+      ]),
+
       /**
       * Plugin: NamedModulesPlugin (experimental)
       * Description: Uses file names as module name.