From e77e40f8ccd646010721dee585afb32a804798db Mon Sep 17 00:00:00 2001
From: Joe Haddad <timer150@gmail.com>
Date: Sat, 13 Jan 2018 23:50:20 -0500
Subject: [PATCH] Warn about browsers during build

---
 packages/react-dev-utils/browsersHelper.js | 38 ++++++++++++++++++++++
 packages/react-dev-utils/package.json      |  4 ++-
 packages/react-scripts/config/paths.js     |  1 +
 packages/react-scripts/package.json        |  4 +++
 packages/react-scripts/scripts/build.js    |  9 +++++
 packages/react-scripts/scripts/start.js    |  7 ++++
 6 files changed, 62 insertions(+), 1 deletion(-)
 create mode 100644 packages/react-dev-utils/browsersHelper.js

diff --git a/packages/react-dev-utils/browsersHelper.js b/packages/react-dev-utils/browsersHelper.js
new file mode 100644
index 00000000000..3c4b4a27b68
--- /dev/null
+++ b/packages/react-dev-utils/browsersHelper.js
@@ -0,0 +1,38 @@
+/**
+ * Copyright (c) 2015-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+const browserslist = require('browserslist');
+const chalk = require('chalk');
+const os = require('os');
+
+function checkBrowsers(dir) {
+  const found = browserslist.findConfig(dir);
+
+  if (found == null) {
+    console.log(
+      chalk.red('As of react-scripts >=2 you must specify targeted browsers.') +
+        os.EOL +
+        `Please add a ${chalk.underline(
+          'browserslist'
+        )} key to your ${chalk.bold('package.json')}.`
+    );
+    return null;
+  }
+  return found;
+}
+
+function printBrowsers(dir) {
+  const browsers = checkBrowsers(dir);
+  console.log(
+    `Built the bundle with browser support for ${browsers == null
+      ? 'defaults'
+      : browsers[process.env.NODE_ENV] || browsers}.`
+  );
+}
+
+module.exports = { checkBrowsers, printBrowsers };
diff --git a/packages/react-dev-utils/package.json b/packages/react-dev-utils/package.json
index d5cf182a897..c9d7f324a20 100644
--- a/packages/react-dev-utils/package.json
+++ b/packages/react-dev-utils/package.json
@@ -11,6 +11,7 @@
     "node": ">=6"
   },
   "files": [
+    "browsersHelper.js",
     "checkRequiredFiles.js",
     "clearConsole.js",
     "crashOverlay.js",
@@ -36,8 +37,9 @@
     "webpackHotDevClient.js"
   ],
   "dependencies": {
-    "address": "1.0.3",
     "@babel/code-frame": "7.0.0-beta.37",
+    "address": "1.0.3",
+    "browserslist": "2.11.1",
     "chalk": "2.3.0",
     "cross-spawn": "5.1.0",
     "detect-port-alt": "1.1.5",
diff --git a/packages/react-scripts/config/paths.js b/packages/react-scripts/config/paths.js
index 718b898bb8d..b9dd95051f2 100644
--- a/packages/react-scripts/config/paths.js
+++ b/packages/react-scripts/config/paths.js
@@ -49,6 +49,7 @@ function getServedPath(appPackageJson) {
 // config after eject: we're in ./config/
 module.exports = {
   dotenv: resolveApp('.env'),
+  appPath: resolveApp('.'),
   appBuild: resolveApp('build'),
   appPublic: resolveApp('public'),
   appHtml: resolveApp('public/index.html'),
diff --git a/packages/react-scripts/package.json b/packages/react-scripts/package.json
index 9768254891f..e41acbe8a93 100644
--- a/packages/react-scripts/package.json
+++ b/packages/react-scripts/package.json
@@ -68,5 +68,9 @@
   },
   "optionalDependencies": {
     "fsevents": "1.1.2"
+  },
+  "browserslist": {
+    "development": "last 2 chrome versions",
+    "production": [">1%", "last 4 versions", "Firefox ESR", "not ie < 11"]
   }
 }
diff --git a/packages/react-scripts/scripts/build.js b/packages/react-scripts/scripts/build.js
index 29712418273..a4ba1cfcdb3 100644
--- a/packages/react-scripts/scripts/build.js
+++ b/packages/react-scripts/scripts/build.js
@@ -40,6 +40,14 @@ const formatWebpackMessages = require('react-dev-utils/formatWebpackMessages');
 const printHostingInstructions = require('react-dev-utils/printHostingInstructions');
 const FileSizeReporter = require('react-dev-utils/FileSizeReporter');
 const printBuildError = require('react-dev-utils/printBuildError');
+const { printBrowsers } = require('react-dev-utils/browsersHelper');
+// @remove-on-eject-begin
+// Require browsers to be specified before you eject
+const { checkBrowsers } = require('react-dev-utils/browsersHelper');
+if (!checkBrowsers(paths.appPath)) {
+  process.exit(1);
+}
+// @remove-on-eject-end
 
 const measureFileSizesBeforeBuild =
   FileSizeReporter.measureFileSizesBeforeBuild;
@@ -107,6 +115,7 @@ measureFileSizesBeforeBuild(paths.appBuild)
         buildFolder,
         useYarn
       );
+      printBrowsers(paths.appPath);
     },
     err => {
       console.log(chalk.red('Failed to compile.\n'));
diff --git a/packages/react-scripts/scripts/start.js b/packages/react-scripts/scripts/start.js
index 373d427da2b..2940dd90bad 100644
--- a/packages/react-scripts/scripts/start.js
+++ b/packages/react-scripts/scripts/start.js
@@ -48,6 +48,13 @@ const createDevServerConfig = require('../config/webpackDevServer.config');
 
 const useYarn = fs.existsSync(paths.yarnLockFile);
 const isInteractive = process.stdout.isTTY;
+// @remove-on-eject-begin
+// Require browsers to be specified before you eject
+const { checkBrowsers } = require('react-dev-utils/browsersHelper');
+if (!checkBrowsers(paths.appPath)) {
+  process.exit(1);
+}
+// @remove-on-eject-end
 
 // Warn and crash if required files are missing
 if (!checkRequiredFiles([paths.appHtml, paths.appIndexJs])) {