diff --git a/packages/react-dev-utils/browsersHelper.js b/packages/react-dev-utils/browsersHelper.js new file mode 100644 index 00000000000..8358f851870 --- /dev/null +++ b/packages/react-dev-utils/browsersHelper.js @@ -0,0 +1,44 @@ +/** + * 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) { + let browsers = checkBrowsers(dir); + if (browsers == null) { + console.log('Built the bundle with default browser support.'); + return; + } + browsers = browsers[process.env.NODE_ENV] || browsers; + if (Array.isArray(browsers)) { + browsers = browsers.join(', '); + } + console.log( + `Built the bundle with browser support for ${chalk.cyan(browsers)}.` + ); +} + +module.exports = { checkBrowsers, printBrowsers }; diff --git a/packages/react-dev-utils/package.json b/packages/react-dev-utils/package.json index 04aa0ccd455..c8f086ced87 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 aebe3ec84b2..d213c01a911 100644 --- a/packages/react-scripts/package.json +++ b/packages/react-scripts/package.json @@ -67,6 +67,10 @@ "react-dom": "^16.0.0" }, "optionalDependencies": { - "fsevents": "^1.1.3" + "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 1adb8e03ce8..3694cce57cd 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])) {