feat(@angular/cli): add --stats-json flag to build (#4189)

Allows you to run ng build --json which generates dist/stats.json. This can then be used with things like the webpack-bundle-analyzer or https://webpack.github.io/analyse/

Fix #3179

Author: winkerVSbecks

docs/documentation/build.md

@@ -94,3 +94,5 @@ or `ng serve --prod` will also make use of uglifying and tree-shaking functional
 `--extract-css` (`-ec`) extract css from global styles onto css files instead of js ones
 
 `--output-hashing` define the output filename cache-busting hashing mode
+
+`--stats-json` generates a `stats.json` file which can be analyzed using tools such as: `webpack-bundle-analyzer` or https://webpack.github.io/analyse

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

@@ -31,10 +31,12 @@ export const baseBuildCommandOptions: any = [
     description: 'define the output filename cache-busting hashing mode',
     aliases: ['oh']
   },
+  { name: 'stats-json', type: Boolean, default: false },
 ];
 
 export interface BuildTaskOptions extends BuildOptions {
   watch?: boolean;
+  statsJson?: boolean;
 }
 
 const BuildCommand = Command.extend({

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

@@ -7,6 +7,7 @@ import { BuildTaskOptions } from '../commands/build';
 import { NgCliWebpackConfig } from '../models/webpack-config';
 import { getWebpackStatsConfig } from '../models/webpack-configs/utils';
 import { CliConfig } from '../models/config';
+const fs = require('fs');
 
 
 export default Task.extend({
@@ -36,6 +37,15 @@ export default Task.extend({
           return;
         }
 
+        if (!runTaskOptions.watch && runTaskOptions.statsJson) {
+          const jsonStats = stats.toJson('verbose');
+
+          fs.writeFileSync(
+            path.resolve(project.root, outputPath, 'stats.json'),
+            JSON.stringify(jsonStats, null, 2)
+          );
+        }
+
         if (stats.hasErrors()) {
           reject();
         } else {

tests/e2e/tests/build/json.ts

@@ -0,0 +1,10 @@
+import {ng} from '../../utils/process';
+import {expectFileToExist} from '../../utils/fs';
+import {expectGitToBeClean} from '../../utils/git';
+
+
+export default function() {
+  return ng('build', '--stats-json')
+    .then(() => expectFileToExist('./dist/stats.json'))
+    .then(() => expectGitToBeClean());
+}