From af5957c2d79e4420be252394ed07e37a0631c6ee Mon Sep 17 00:00:00 2001
From: Joe Haddad <timer150@gmail.com>
Date: Mon, 24 Oct 2016 01:36:25 -0400
Subject: [PATCH 1/2] Add BuildProgressPlugin

---
 .../react-dev-utils/BuildProgressPlugin.js    | 23 +++++++++++++++++++
 packages/react-dev-utils/package.json         |  5 ++++
 .../config/webpack.config.prod.js             |  5 +++-
 3 files changed, 32 insertions(+), 1 deletion(-)
 create mode 100644 packages/react-dev-utils/BuildProgressPlugin.js

diff --git a/packages/react-dev-utils/BuildProgressPlugin.js b/packages/react-dev-utils/BuildProgressPlugin.js
new file mode 100644
index 00000000000..bd7d0eeb73f
--- /dev/null
+++ b/packages/react-dev-utils/BuildProgressPlugin.js
@@ -0,0 +1,23 @@
+'use strict';
+
+const path = require('path');
+
+const ProgressPlugin = require('webpack').ProgressPlugin;
+const ProgressBar = require('progress');
+const chalk = require('chalk');
+
+function BuildProgressPlugin() {
+  const bar = new ProgressBar(`  [:bar] ${ chalk.bold(':percent') } ${ chalk.yellow(':etas') } (${ chalk.dim(':msg') })`, {
+    total: 100,
+    complete: '=',
+    incomplete: ' ',
+    width: 25
+  });
+  return new ProgressPlugin(function (percent, msg) {
+    if (percent === 1) msg = 'completed';
+    bar.update(percent, { msg });
+    if (percent === 1) bar.terminate();
+  });
+}
+
+module.exports = BuildProgressPlugin;
diff --git a/packages/react-dev-utils/package.json b/packages/react-dev-utils/package.json
index f3062c56d19..d76fdad1e04 100644
--- a/packages/react-dev-utils/package.json
+++ b/packages/react-dev-utils/package.json
@@ -11,6 +11,7 @@
     "node": ">=4"
   },
   "files": [
+    "BuildProgressPlugin.js",
     "clearConsole.js",
     "checkRequiredFiles.js",
     "formatWebpackMessages.js",
@@ -28,7 +29,11 @@
     "escape-string-regexp": "1.0.5",
     "html-entities": "1.2.0",
     "opn": "4.0.2",
+    "progress": "1.1.8",
     "sockjs-client": "1.0.1",
     "strip-ansi": "3.0.1"
+  },
+  "devDependencies": {
+    "webpack": "^1.14.0"
   }
 }
diff --git a/packages/react-scripts/config/webpack.config.prod.js b/packages/react-scripts/config/webpack.config.prod.js
index 058db0d7921..f1d84028bc6 100644
--- a/packages/react-scripts/config/webpack.config.prod.js
+++ b/packages/react-scripts/config/webpack.config.prod.js
@@ -18,6 +18,7 @@ var InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
 var url = require('url');
 var paths = require('./paths');
 var getClientEnvironment = require('./env');
+var BuildProgressPlugin = require('react-dev-utils/BuildProgressPlugin');
 
 // @remove-on-eject-begin
 // `path` is not used after eject - see https://github.com/facebookincubator/create-react-app/issues/1174
@@ -268,7 +269,9 @@ module.exports = {
     // having to parse `index.html`.
     new ManifestPlugin({
       fileName: 'asset-manifest.json'
-    })
+    }),
+    // Displays a progress bar during the build
+    new BuildProgressPlugin()
   ],
   // Some libraries import Node modules but don't use them in the browser.
   // Tell Webpack to provide empty mocks for them so importing them works.

From 4ff49f1cae168c92298903a7e0816c67b621f0a4 Mon Sep 17 00:00:00 2001
From: Joe Haddad <timer150@gmail.com>
Date: Mon, 23 Jan 2017 18:55:02 -0500
Subject: [PATCH 2/2] noop ProgressPlugin when running CI

---
 packages/react-dev-utils/BuildProgressPlugin.js | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/packages/react-dev-utils/BuildProgressPlugin.js b/packages/react-dev-utils/BuildProgressPlugin.js
index bd7d0eeb73f..04190102fc3 100644
--- a/packages/react-dev-utils/BuildProgressPlugin.js
+++ b/packages/react-dev-utils/BuildProgressPlugin.js
@@ -7,16 +7,26 @@ const ProgressBar = require('progress');
 const chalk = require('chalk');
 
 function BuildProgressPlugin() {
+  if (process.env.CI) {
+    return new ProgressPlugin(function handler(percentage, msg) {
+      // noop
+    })
+  }
   const bar = new ProgressBar(`  [:bar] ${ chalk.bold(':percent') } ${ chalk.yellow(':etas') } (${ chalk.dim(':msg') })`, {
     total: 100,
     complete: '=',
     incomplete: ' ',
     width: 25
   });
-  return new ProgressPlugin(function (percent, msg) {
-    if (percent === 1) msg = 'completed';
+  return new ProgressPlugin(function handler(percent, msg) {
+    const done = percent === 1;
+    if (done) {
+      msg = 'completed';
+    }
     bar.update(percent, { msg });
-    if (percent === 1) bar.terminate();
+    if (done) {
+      bar.terminate();
+    }
   });
 }