feat(@angular/cli): make the common chunk optional/configurable

- Add options to the build command to disable or configure the common chunk.
- The existing behavior is maintained by default.

closes #7021

Author: kevinbuhmann

docs/documentation/build.md

@@ -293,6 +293,26 @@ Note: service worker support is experimental and subject to change.
   </p>
 </details>
 
+<details>
+  <summary>common-chunk</summary>
+  <p>
+    <code>--common-chunk</code> (aliases: <code>-cc</code>) <em>default value: true</em>
+  </p>
+  <p>
+    Use a separate bundle containing code used across multiple bundles.
+  </p>
+</details>
+
+<details>
+  <summary>common-chunk-min-chunks</summary>
+  <p>
+    <code>--common-chunk-min-chunks</code> (aliases: <code>-ccm</code>) <em>default value: 2</em>
+  </p>
+  <p>
+    The minimum number of bundles that must use a module before it is moved to the common chunk.
+  </p>
+</details>
+
 <details>
   <summary>verbose</summary>
   <p>

docs/documentation/eject.md

@@ -182,6 +182,26 @@ ng eject
   </p>
 </details>
 
+<details>
+  <summary>common-chunk</summary>
+  <p>
+    <code>--common-chunk</code> (aliases: <code>-cc</code>) <em>default value: true</em>
+  </p>
+  <p>
+    Use a separate bundle containing code used across multiple bundles.
+  </p>
+</details>
+
+<details>
+  <summary>common-chunk-min-chunks</summary>
+  <p>
+    <code>--common-chunk-min-chunks</code> (aliases: <code>-ccm</code>) <em>default value: 2</em>
+  </p>
+  <p>
+    The minimum number of bundles that must use a module before it is moved to the common chunk.
+  </p>
+</details>
+
 <details>
   <summary>verbose</summary>
   <p>

docs/documentation/serve.md

@@ -258,6 +258,26 @@ All the build Options are available in serve, below are the additional options.
   </p>
 </details>
 
+<details>
+  <summary>common-chunk</summary>
+  <p>
+    <code>--common-chunk</code> (aliases: <code>-cc</code>) <em>default value: true</em>
+  </p>
+  <p>
+    Use a separate bundle containing code used across multiple bundles.
+  </p>
+</details>
+
+<details>
+  <summary>common-chunk-min-chunks</summary>
+  <p>
+    <code>--common-chunk-min-chunks</code> (aliases: <code>-ccm</code>) <em>default value: 2</em>
+  </p>
+  <p>
+    The minimum number of bundles that must use a module before it is moved to the common chunk.
+  </p>
+</details>
+
 <details>
   <summary>verbose</summary>
   <p>

packages/@angular/cli/commands/build.ts

@@ -52,6 +52,21 @@ export const baseBuildCommandOptions: any = [
     aliases: ['vc'],
     description: 'Use a separate bundle containing only vendor libraries.'
   },
+  {
+    name: 'common-chunk',
+    type: Boolean,
+    default: true,
+    aliases: ['cc'],
+    description: 'Use a separate bundle containing code used across multiple bundles.'
+  },
+  {
+    name: 'common-chunk-min-chunks',
+    type: Number,
+    default: 2,
+    aliases: ['ccm'],
+    description: oneLine`The minimum number of bundles that must use a module before it is moved to
+      the common chunk.`
+  },
   {
     name: 'base-href',
     type: String,

packages/@angular/cli/models/build-options.ts

@@ -5,6 +5,8 @@ export interface BuildOptions {
   aot?: boolean;
   sourcemaps?: boolean;
   vendorChunk?: boolean;
+  commonChunk?: boolean;
+  commonChunkMinChunks?: number;
   baseHref?: string;
   deployUrl?: string;
   verbose?: boolean;

packages/@angular/cli/models/webpack-config.ts

@@ -70,6 +70,12 @@ export class NgCliWebpackConfig {
     if (buildOptions.target !== 'development' && buildOptions.target !== 'production') {
       throw new Error("Invalid build target. Only 'development' and 'production' are available.");
     }
+
+    buildOptions.commonChunkMinChunks = buildOptions.commonChunk ?
+      buildOptions.commonChunkMinChunks : undefined;
+    if (buildOptions.commonChunkMinChunks < 2) {
+      throw new Error('The common chunk min chunks value must be greater than or equal to 2');
+    }
   }
 
   // Fill in defaults for build targets

packages/@angular/cli/models/webpack-configs/browser.ts

@@ -51,6 +51,15 @@ export function getBrowserConfig(wco: WebpackConfigOptions) {
     }));
   }
 
+  if (buildOptions.commonChunk) {
+    extraPlugins.push(new webpack.optimize.CommonsChunkPlugin({
+      name: 'main',
+      async: 'common',
+      children: true,
+      minChunks: buildOptions.commonChunkMinChunks
+    }));
+  }
+
   return {
     plugins: [
       new HtmlWebpackPlugin({
@@ -68,12 +77,6 @@ export function getBrowserConfig(wco: WebpackConfigOptions) {
       new BaseHrefWebpackPlugin({
         baseHref: buildOptions.baseHref
       }),
-      new webpack.optimize.CommonsChunkPlugin({
-        name: 'main',
-        async: 'common',
-        children: true,
-        minChunks: 2
-      }),
       new webpack.optimize.CommonsChunkPlugin({
         minChunks: Infinity,
         name: 'inline'