From 0f01012488d581c15be7dbcac5f566ec4e50c2c5 Mon Sep 17 00:00:00 2001
From: Dan <dan.abramov@gmail.com>
Date: Sat, 13 Jan 2018 00:49:56 +0000
Subject: [PATCH 1/6] Run real scripts in local development

---
 package.json | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index 9a32bc1350f..66e652b9f87 100644
--- a/package.json
+++ b/package.json
@@ -4,16 +4,16 @@
     "packages/*"
   ],
   "scripts": {
-    "build": "cd packages/react-scripts && node scripts/build.js",
+    "build": "cd packages/react-scripts && node bin/react-scripts.js build",
     "changelog": "lerna-changelog",
     "create-react-app": "node tasks/cra.js",
     "e2e": "tasks/e2e-simple.sh",
     "e2e:docker": "tasks/local-test.sh",
     "postinstall": "cd packages/react-error-overlay/ && yarn build:prod",
     "publish": "tasks/publish.sh",
-    "start": "cd packages/react-scripts && node scripts/start.js",
+    "start": "cd packages/react-scripts && node bin/react-scripts.js start",
     "screencast": "svg-term --cast hItN7sl5yfCPTHxvFg5glhhfp --out screencast.svg --window",
-    "test": "cd packages/react-scripts && node scripts/test.js --env=jsdom",
+    "test": "cd packages/react-scripts && node bin/react-scripts.js test --env=jsdom",
     "format": "prettier --trailing-comma es5 --single-quote --write 'packages/*/*.js' 'packages/*/!(node_modules)/**/*.js'",
     "precommit": "lint-staged"
   },

From 236653befc2a7c62520a45a9762db4971cf697c4 Mon Sep 17 00:00:00 2001
From: Dan <dan.abramov@gmail.com>
Date: Sat, 13 Jan 2018 02:26:54 +0000
Subject: [PATCH 2/6] Add preflight check warning

---
 package.json                                |   2 +-
 packages/react-scripts/bin/react-scripts.js | 156 ++++++++++++++++++++
 2 files changed, 157 insertions(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 66e652b9f87..bc78dfee6b6 100644
--- a/package.json
+++ b/package.json
@@ -18,7 +18,7 @@
     "precommit": "lint-staged"
   },
   "devDependencies": {
-    "eslint": "^4.4.1",
+    "eslint": "4.15.0",
     "husky": "^0.13.2",
     "lerna": "2.6.0",
     "lerna-changelog": "^0.6.0",
diff --git a/packages/react-scripts/bin/react-scripts.js b/packages/react-scripts/bin/react-scripts.js
index 9de034ff0d9..caa26d677e7 100755
--- a/packages/react-scripts/bin/react-scripts.js
+++ b/packages/react-scripts/bin/react-scripts.js
@@ -8,6 +8,162 @@
 
 'use strict';
 
+// Makes the script crash on unhandled rejections instead of silently
+// ignoring them. In the future, promise rejections that are not handled will
+// terminate the Node.js process with a non-zero exit code.
+process.on('unhandledRejection', err => {
+  throw err;
+});
+
+// Set this so that importing "../config/env" doesn't fail.
+// In practice it won't matter because we'll spawn another process now.
+process.env.NODE_ENV = 'development';
+// Ensure environment variables are read.
+require('../config/env');
+
+const chalk = require('chalk');
+const fs = require('fs');
+const path = require('path');
+
+// We assume that having wrong versions of these
+// in the tree will likely break your setup.
+// This is a relatively low-effort way to find common issues.
+function verifyPackageTree() {
+  const depsToCheck = [
+    // These are packages most likely to break in practice.
+    // See https://github.com/facebookincubator/create-react-app/issues/1795 for reasons why.
+    // I have not included Babel here because plugins typically don't import Babel (so it's not affected).
+    'eslint',
+    'jest',
+    'webpack',
+    'webpack-dev-server',
+  ];
+  // Inlined from semver-regex, MIT license.
+  // Don't want to make this a dependency after ejecting.
+  const getSemverRegex = () =>
+    /\bv?(?:0|[1-9]\d*)\.(?:0|[1-9]\d*)\.(?:0|[1-9]\d*)(?:-[\da-z-]+(?:\.[\da-z-]+)*)?(?:\+[\da-z-]+(?:\.[\da-z-]+)*)?\b/gi;
+  const ownPackageJson = require('../package.json');
+  const expectedVersionsByDep = {};
+  // Gather wanted deps
+  depsToCheck.forEach(dep => {
+    const expectedVersion = ownPackageJson.dependencies[dep];
+    if (!expectedVersion) {
+      throw new Error('This dependency list is outdated, fix it.');
+    }
+    if (!getSemverRegex().test(expectedVersion)) {
+      throw new Error(
+        `The ${dep} package should be pinned, instead got version ${expectedVersion}.`
+      );
+    }
+    expectedVersionsByDep[dep] = expectedVersion;
+  });
+  // Verify we don't have other versions up the tree
+  let currentDir = __dirname;
+  while (true) {
+    const previousDir = currentDir;
+    currentDir = path.resolve(currentDir, '..');
+    if (currentDir === previousDir) {
+      // We've reached the root.
+      break;
+    }
+    const maybeNodeModules = path.resolve(currentDir, 'node_modules');
+    if (!fs.existsSync(maybeNodeModules)) {
+      continue;
+    }
+    depsToCheck.forEach(dep => {
+      const maybeDep = path.resolve(maybeNodeModules, dep);
+      if (!fs.existsSync(maybeDep)) {
+        return;
+      }
+      const maybeDepPackageJson = path.resolve(maybeDep, 'package.json');
+      if (!fs.existsSync(maybeDepPackageJson)) {
+        return;
+      }
+      const depPackageJson = JSON.parse(
+        fs.readFileSync(maybeDepPackageJson, 'utf8')
+      );
+      const expectedVersion = expectedVersionsByDep[dep];
+      if (depPackageJson.version !== expectedVersion) {
+        console.error(
+          chalk.red(
+            `There might be a problem with the project dependency tree.\n` +
+              `It is likely ${chalk.bold(
+                'not'
+              )} a bug in Create React App, but something you need to fix locally.\n\n`
+          ) +
+            `The ${chalk.bold(
+              'react-scripts'
+            )} package provided by Create React App requires a dependency:\n\n` +
+            chalk.green(
+              `  "${chalk.bold(dep)}": "${chalk.bold(expectedVersion)}"\n\n`
+            ) +
+            `However, a different version of ${chalk.bold(
+              dep
+            )} was detected higher up in the tree:\n\n` +
+            `  ${chalk.bold(chalk.red(maybeDep))} (version: ${chalk.bold(
+              chalk.red(depPackageJson.version)
+            )}) \n\n` +
+            `This is known to cause hard-to-debug issues.\n` +
+            `Try following these steps:\n\n` +
+            `  ${chalk.cyan('1.')} Delete ${chalk.bold(
+              'package-lock.json'
+            )} (${chalk.underline('not')} ${chalk.bold(
+              'package.json'
+            )}!) and/or ${chalk.bold(
+              'yarn.lock'
+            )} in your project folder.\n\n` +
+            `  ${chalk.cyan('2.')} Delete ${chalk.bold(
+              'node_modules'
+            )} in your project folder.\n\n` +
+            `  ${chalk.cyan('3.')} Remove "${chalk.bold(
+              dep
+            )}" from ${chalk.bold('dependencies')} and/or ${chalk.bold(
+              'devDependencies'
+            )} in the ${chalk.bold(
+              'package.json'
+            )} file in your project folder.\n\n` +
+            `  ${chalk.cyan('4.')} Run ${chalk.bold(
+              'npm install'
+            )} or ${chalk.bold(
+              'yarn'
+            )}, depending on the package manager you use.\n\n` +
+            `If this has not helped, there are a few other things to try:\n\n` +
+            `  ${chalk.cyan('5.')} If you used ${chalk.bold(
+              'npm'
+            )}, install ${chalk.bold(
+              'yarn'
+            )} (http://yarnpkg.com/) and repeat the above steps with it instead.\n` +
+            `     This may help because npm has known issues with package hoisting which may get resolved in future versions.\n\n` +
+            `  ${chalk.cyan('6.')} Check if ${chalk.bold(
+              maybeDep
+            )} is outside your project directory.\n` +
+            `     For example, you might have installed something accidentally in your home folder.\n\n` +
+            `  ${chalk.cyan('7.')} Try running ${chalk.bold(
+              `npm ls ${dep}`
+            )} in your project folder.\n` +
+            `     This will tell you which ${chalk.underline(
+              'other'
+            )} package (apart from the expected ${chalk.bold(
+              'react-scripts'
+            )}) installed ${chalk.bold(dep)}.\n\n` +
+            `If nothing else helps, add ${chalk.bold(
+              'SKIP_PREFLIGHT_CHECK=true'
+            )} to an ${chalk.bold('.env')} file in your project.\n` +
+            `This permanently disables this preflight check in case you want to proceed anyway.\n\n` +
+            chalk.cyan(
+              `P.S. We know this message is long but please read the steps above :-) We hope you find them helpful!\n`
+            )
+        );
+        process.exit(1);
+      }
+    });
+  }
+}
+
+if (process.env.SKIP_PREFLIGHT_CHECK !== 'true') {
+  verifyPackageTree();
+}
+
 const spawn = require('react-dev-utils/crossSpawn');
 const args = process.argv.slice(2);
 

From 0189867fee2e783e2feebc1fc656bf91bbb248bb Mon Sep 17 00:00:00 2001
From: Dan <dan.abramov@gmail.com>
Date: Sat, 13 Jan 2018 02:54:11 +0000
Subject: [PATCH 3/6] I know what I am doing

---
 packages/react-scripts/bin/react-scripts.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/react-scripts/bin/react-scripts.js b/packages/react-scripts/bin/react-scripts.js
index caa26d677e7..c098b45daab 100755
--- a/packages/react-scripts/bin/react-scripts.js
+++ b/packages/react-scripts/bin/react-scripts.js
@@ -59,6 +59,7 @@ function verifyPackageTree() {
   });
   // Verify we don't have other versions up the tree
   let currentDir = __dirname;
+  // eslint-disable-next-line no-constant-condition
   while (true) {
     const previousDir = currentDir;
     currentDir = path.resolve(currentDir, '..');

From 34ee0de8bfa5d21313b5336671f17eef2daa6cbc Mon Sep 17 00:00:00 2001
From: Dan <dan.abramov@gmail.com>
Date: Sat, 13 Jan 2018 15:18:06 +0000
Subject: [PATCH 4/6] Move preflight check into individual scripts

This ensures we don't try to filter NODE_PATH twice, accidentally removing the now-absolute path.
---
 packages/react-scripts/bin/react-scripts.js   | 150 ------------------
 packages/react-scripts/scripts/build.js       |   7 +
 packages/react-scripts/scripts/start.js       |   7 +
 packages/react-scripts/scripts/test.js        |   7 +
 .../scripts/utils/verifyPackageTree.js        | 149 +++++++++++++++++
 5 files changed, 170 insertions(+), 150 deletions(-)
 create mode 100644 packages/react-scripts/scripts/utils/verifyPackageTree.js

diff --git a/packages/react-scripts/bin/react-scripts.js b/packages/react-scripts/bin/react-scripts.js
index c098b45daab..9e41f5da2b9 100755
--- a/packages/react-scripts/bin/react-scripts.js
+++ b/packages/react-scripts/bin/react-scripts.js
@@ -15,156 +15,6 @@ process.on('unhandledRejection', err => {
   throw err;
 });
 
-// Set this so that importing "../config/env" doesn't fail.
-// In practice it won't matter because we'll spawn another process now.
-process.env.NODE_ENV = 'development';
-// Ensure environment variables are read.
-require('../config/env');
-
-const chalk = require('chalk');
-const fs = require('fs');
-const path = require('path');
-
-// We assume that having wrong versions of these
-// in the tree will likely break your setup.
-// This is a relatively low-effort way to find common issues.
-function verifyPackageTree() {
-  const depsToCheck = [
-    // These are packages most likely to break in practice.
-    // See https://github.com/facebookincubator/create-react-app/issues/1795 for reasons why.
-    // I have not included Babel here because plugins typically don't import Babel (so it's not affected).
-    'eslint',
-    'jest',
-    'webpack',
-    'webpack-dev-server',
-  ];
-  // Inlined from semver-regex, MIT license.
-  // Don't want to make this a dependency after ejecting.
-  const getSemverRegex = () =>
-    /\bv?(?:0|[1-9]\d*)\.(?:0|[1-9]\d*)\.(?:0|[1-9]\d*)(?:-[\da-z-]+(?:\.[\da-z-]+)*)?(?:\+[\da-z-]+(?:\.[\da-z-]+)*)?\b/gi;
-  const ownPackageJson = require('../package.json');
-  const expectedVersionsByDep = {};
-  // Gather wanted deps
-  depsToCheck.forEach(dep => {
-    const expectedVersion = ownPackageJson.dependencies[dep];
-    if (!expectedVersion) {
-      throw new Error('This dependency list is outdated, fix it.');
-    }
-    if (!getSemverRegex().test(expectedVersion)) {
-      throw new Error(
-        `The ${dep} package should be pinned, instead got version ${expectedVersion}.`
-      );
-    }
-    expectedVersionsByDep[dep] = expectedVersion;
-  });
-  // Verify we don't have other versions up the tree
-  let currentDir = __dirname;
-  // eslint-disable-next-line no-constant-condition
-  while (true) {
-    const previousDir = currentDir;
-    currentDir = path.resolve(currentDir, '..');
-    if (currentDir === previousDir) {
-      // We've reached the root.
-      break;
-    }
-    const maybeNodeModules = path.resolve(currentDir, 'node_modules');
-    if (!fs.existsSync(maybeNodeModules)) {
-      continue;
-    }
-    depsToCheck.forEach(dep => {
-      const maybeDep = path.resolve(maybeNodeModules, dep);
-      if (!fs.existsSync(maybeDep)) {
-        return;
-      }
-      const maybeDepPackageJson = path.resolve(maybeDep, 'package.json');
-      if (!fs.existsSync(maybeDepPackageJson)) {
-        return;
-      }
-      const depPackageJson = JSON.parse(
-        fs.readFileSync(maybeDepPackageJson, 'utf8')
-      );
-      const expectedVersion = expectedVersionsByDep[dep];
-      if (depPackageJson.version !== expectedVersion) {
-        console.error(
-          chalk.red(
-            `There might be a problem with the project dependency tree.\n` +
-              `It is likely ${chalk.bold(
-                'not'
-              )} a bug in Create React App, but something you need to fix locally.\n\n`
-          ) +
-            `The ${chalk.bold(
-              'react-scripts'
-            )} package provided by Create React App requires a dependency:\n\n` +
-            chalk.green(
-              `  "${chalk.bold(dep)}": "${chalk.bold(expectedVersion)}"\n\n`
-            ) +
-            `However, a different version of ${chalk.bold(
-              dep
-            )} was detected higher up in the tree:\n\n` +
-            `  ${chalk.bold(chalk.red(maybeDep))} (version: ${chalk.bold(
-              chalk.red(depPackageJson.version)
-            )}) \n\n` +
-            `This is known to cause hard-to-debug issues.\n` +
-            `Try following these steps:\n\n` +
-            `  ${chalk.cyan('1.')} Delete ${chalk.bold(
-              'package-lock.json'
-            )} (${chalk.underline('not')} ${chalk.bold(
-              'package.json'
-            )}!) and/or ${chalk.bold(
-              'yarn.lock'
-            )} in your project folder.\n\n` +
-            `  ${chalk.cyan('2.')} Delete ${chalk.bold(
-              'node_modules'
-            )} in your project folder.\n\n` +
-            `  ${chalk.cyan('3.')} Remove "${chalk.bold(
-              dep
-            )}" from ${chalk.bold('dependencies')} and/or ${chalk.bold(
-              'devDependencies'
-            )} in the ${chalk.bold(
-              'package.json'
-            )} file in your project folder.\n\n` +
-            `  ${chalk.cyan('4.')} Run ${chalk.bold(
-              'npm install'
-            )} or ${chalk.bold(
-              'yarn'
-            )}, depending on the package manager you use.\n\n` +
-            `If this has not helped, there are a few other things to try:\n\n` +
-            `  ${chalk.cyan('5.')} If you used ${chalk.bold(
-              'npm'
-            )}, install ${chalk.bold(
-              'yarn'
-            )} (http://yarnpkg.com/) and repeat the above steps with it instead.\n` +
-            `     This may help because npm has known issues with package hoisting which may get resolved in future versions.\n\n` +
-            `  ${chalk.cyan('6.')} Check if ${chalk.bold(
-              maybeDep
-            )} is outside your project directory.\n` +
-            `     For example, you might have installed something accidentally in your home folder.\n\n` +
-            `  ${chalk.cyan('7.')} Try running ${chalk.bold(
-              `npm ls ${dep}`
-            )} in your project folder.\n` +
-            `     This will tell you which ${chalk.underline(
-              'other'
-            )} package (apart from the expected ${chalk.bold(
-              'react-scripts'
-            )}) installed ${chalk.bold(dep)}.\n\n` +
-            `If nothing else helps, add ${chalk.bold(
-              'SKIP_PREFLIGHT_CHECK=true'
-            )} to an ${chalk.bold('.env')} file in your project.\n` +
-            `This permanently disables this preflight check in case you want to proceed anyway.\n\n` +
-            chalk.cyan(
-              `P.S. We know this message is long but please read the steps above :-) We hope you find them helpful!\n`
-            )
-        );
-        process.exit(1);
-      }
-    });
-  }
-}
-
-if (process.env.SKIP_PREFLIGHT_CHECK !== 'true') {
-  verifyPackageTree();
-}
-
 const spawn = require('react-dev-utils/crossSpawn');
 const args = process.argv.slice(2);
 
diff --git a/packages/react-scripts/scripts/build.js b/packages/react-scripts/scripts/build.js
index 930897008e1..29712418273 100644
--- a/packages/react-scripts/scripts/build.js
+++ b/packages/react-scripts/scripts/build.js
@@ -21,6 +21,13 @@ process.on('unhandledRejection', err => {
 
 // Ensure environment variables are read.
 require('../config/env');
+// @remove-on-eject-begin
+// Do the preflight check (only happens before eject).
+const verifyPackageTree = require('./utils/verifyPackageTree');
+if (process.env.SKIP_PREFLIGHT_CHECK !== 'true') {
+  verifyPackageTree();
+}
+// @remove-on-eject-end
 
 const path = require('path');
 const chalk = require('chalk');
diff --git a/packages/react-scripts/scripts/start.js b/packages/react-scripts/scripts/start.js
index 7eb7ad464c0..373d427da2b 100644
--- a/packages/react-scripts/scripts/start.js
+++ b/packages/react-scripts/scripts/start.js
@@ -21,6 +21,13 @@ process.on('unhandledRejection', err => {
 
 // Ensure environment variables are read.
 require('../config/env');
+// @remove-on-eject-begin
+// Do the preflight check (only happens before eject).
+const verifyPackageTree = require('./utils/verifyPackageTree');
+if (process.env.SKIP_PREFLIGHT_CHECK !== 'true') {
+  verifyPackageTree();
+}
+// @remove-on-eject-end
 
 const fs = require('fs');
 const chalk = require('chalk');
diff --git a/packages/react-scripts/scripts/test.js b/packages/react-scripts/scripts/test.js
index b30113fe662..ee592d9b115 100644
--- a/packages/react-scripts/scripts/test.js
+++ b/packages/react-scripts/scripts/test.js
@@ -22,6 +22,13 @@ process.on('unhandledRejection', err => {
 
 // Ensure environment variables are read.
 require('../config/env');
+// @remove-on-eject-begin
+// Do the preflight check (only happens before eject).
+const verifyPackageTree = require('./utils/verifyPackageTree');
+if (process.env.SKIP_PREFLIGHT_CHECK !== 'true') {
+  verifyPackageTree();
+}
+// @remove-on-eject-end
 
 const jest = require('jest');
 const argv = process.argv.slice(2);
diff --git a/packages/react-scripts/scripts/utils/verifyPackageTree.js b/packages/react-scripts/scripts/utils/verifyPackageTree.js
new file mode 100644
index 00000000000..aa4aab60cc6
--- /dev/null
+++ b/packages/react-scripts/scripts/utils/verifyPackageTree.js
@@ -0,0 +1,149 @@
+// @remove-file-on-eject
+/**
+ * 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.
+ */
+
+const chalk = require('chalk');
+const fs = require('fs');
+const path = require('path');
+
+// We assume that having wrong versions of these
+// in the tree will likely break your setup.
+// This is a relatively low-effort way to find common issues.
+function verifyPackageTree() {
+  const depsToCheck = [
+    // These are packages most likely to break in practice.
+    // See https://github.com/facebookincubator/create-react-app/issues/1795 for reasons why.
+    // I have not included Babel here because plugins typically don't import Babel (so it's not affected).
+    'eslint',
+    'jest',
+    'webpack',
+    'webpack-dev-server',
+  ];
+  // Inlined from semver-regex, MIT license.
+  // Don't want to make this a dependency after ejecting.
+  const getSemverRegex = () =>
+    /\bv?(?:0|[1-9]\d*)\.(?:0|[1-9]\d*)\.(?:0|[1-9]\d*)(?:-[\da-z-]+(?:\.[\da-z-]+)*)?(?:\+[\da-z-]+(?:\.[\da-z-]+)*)?\b/gi;
+  const ownPackageJson = require('../../package.json');
+  const expectedVersionsByDep = {};
+  // Gather wanted deps
+  depsToCheck.forEach(dep => {
+    const expectedVersion = ownPackageJson.dependencies[dep];
+    if (!expectedVersion) {
+      throw new Error('This dependency list is outdated, fix it.');
+    }
+    if (!getSemverRegex().test(expectedVersion)) {
+      throw new Error(
+        `The ${dep} package should be pinned, instead got version ${expectedVersion}.`
+      );
+    }
+    expectedVersionsByDep[dep] = expectedVersion;
+  });
+  // Verify we don't have other versions up the tree
+  let currentDir = __dirname;
+  // eslint-disable-next-line no-constant-condition
+  while (true) {
+    const previousDir = currentDir;
+    currentDir = path.resolve(currentDir, '..');
+    if (currentDir === previousDir) {
+      // We've reached the root.
+      break;
+    }
+    const maybeNodeModules = path.resolve(currentDir, 'node_modules');
+    if (!fs.existsSync(maybeNodeModules)) {
+      continue;
+    }
+    depsToCheck.forEach(dep => {
+      const maybeDep = path.resolve(maybeNodeModules, dep);
+      if (!fs.existsSync(maybeDep)) {
+        return;
+      }
+      const maybeDepPackageJson = path.resolve(maybeDep, 'package.json');
+      if (!fs.existsSync(maybeDepPackageJson)) {
+        return;
+      }
+      const depPackageJson = JSON.parse(
+        fs.readFileSync(maybeDepPackageJson, 'utf8')
+      );
+      const expectedVersion = expectedVersionsByDep[dep];
+      if (depPackageJson.version !== expectedVersion) {
+        console.error(
+          chalk.red(
+            `There might be a problem with the project dependency tree.\n` +
+              `It is likely ${chalk.bold(
+                'not'
+              )} a bug in Create React App, but something you need to fix locally.\n\n`
+          ) +
+            `The ${chalk.bold(
+              ownPackageJson.name
+            )} package provided by Create React App requires a dependency:\n\n` +
+            chalk.green(
+              `  "${chalk.bold(dep)}": "${chalk.bold(expectedVersion)}"\n\n`
+            ) +
+            `However, a different version of ${chalk.bold(
+              dep
+            )} was detected higher up in the tree:\n\n` +
+            `  ${chalk.bold(chalk.red(maybeDep))} (version: ${chalk.bold(
+              chalk.red(depPackageJson.version)
+            )}) \n\n` +
+            `This is known to cause hard-to-debug issues.\n` +
+            `Try following these steps:\n\n` +
+            `  ${chalk.cyan('1.')} Delete ${chalk.bold(
+              'package-lock.json'
+            )} (${chalk.underline('not')} ${chalk.bold(
+              'package.json'
+            )}!) and/or ${chalk.bold(
+              'yarn.lock'
+            )} in your project folder.\n\n` +
+            `  ${chalk.cyan('2.')} Delete ${chalk.bold(
+              'node_modules'
+            )} in your project folder.\n\n` +
+            `  ${chalk.cyan('3.')} Remove "${chalk.bold(
+              dep
+            )}" from ${chalk.bold('dependencies')} and/or ${chalk.bold(
+              'devDependencies'
+            )} in the ${chalk.bold(
+              'package.json'
+            )} file in your project folder.\n\n` +
+            `  ${chalk.cyan('4.')} Run ${chalk.bold(
+              'npm install'
+            )} or ${chalk.bold(
+              'yarn'
+            )}, depending on the package manager you use.\n\n` +
+            `If this has not helped, there are a few other things to try:\n\n` +
+            `  ${chalk.cyan('5.')} If you used ${chalk.bold(
+              'npm'
+            )}, install ${chalk.bold(
+              'yarn'
+            )} (http://yarnpkg.com/) and repeat the above steps with it instead.\n` +
+            `     This may help because npm has known issues with package hoisting which may get resolved in future versions.\n\n` +
+            `  ${chalk.cyan('6.')} Check if ${chalk.bold(
+              maybeDep
+            )} is outside your project directory.\n` +
+            `     For example, you might have installed something accidentally in your home folder.\n\n` +
+            `  ${chalk.cyan('7.')} Try running ${chalk.bold(
+              `npm ls ${dep}`
+            )} in your project folder.\n` +
+            `     This will tell you which ${chalk.underline(
+              'other'
+            )} package (apart from the expected ${chalk.bold(
+              ownPackageJson.name
+            )}) installed ${chalk.bold(dep)}.\n\n` +
+            `If nothing else helps, add ${chalk.bold(
+              'SKIP_PREFLIGHT_CHECK=true'
+            )} to an ${chalk.bold('.env')} file in your project.\n` +
+            `This permanently disables this preflight check in case you want to proceed anyway.\n\n` +
+            chalk.cyan(
+              `P.S. We know this message is long but please read the steps above :-) We hope you find them helpful!\n`
+            )
+        );
+        process.exit(1);
+      }
+    });
+  }
+}
+
+module.exports = verifyPackageTree;

From e70e64ef69f11a45ab10f7b8f8f166f6ac1a61b1 Mon Sep 17 00:00:00 2001
From: Dan <dan.abramov@gmail.com>
Date: Sat, 13 Jan 2018 15:28:12 +0000
Subject: [PATCH 5/6] Slightly tweak the wording

---
 .../scripts/utils/verifyPackageTree.js             | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/packages/react-scripts/scripts/utils/verifyPackageTree.js b/packages/react-scripts/scripts/utils/verifyPackageTree.js
index aa4aab60cc6..55dc7fbd99b 100644
--- a/packages/react-scripts/scripts/utils/verifyPackageTree.js
+++ b/packages/react-scripts/scripts/utils/verifyPackageTree.js
@@ -72,7 +72,7 @@ function verifyPackageTree() {
       if (depPackageJson.version !== expectedVersion) {
         console.error(
           chalk.red(
-            `There might be a problem with the project dependency tree.\n` +
+            `\nThere might be a problem with the project dependency tree.\n` +
               `It is likely ${chalk.bold(
                 'not'
               )} a bug in Create React App, but something you need to fix locally.\n\n`
@@ -83,14 +83,15 @@ function verifyPackageTree() {
             chalk.green(
               `  "${chalk.bold(dep)}": "${chalk.bold(expectedVersion)}"\n\n`
             ) +
+            `Don't try to install it manually: your package manager does it automatically.\n` +
             `However, a different version of ${chalk.bold(
               dep
             )} was detected higher up in the tree:\n\n` +
             `  ${chalk.bold(chalk.red(maybeDep))} (version: ${chalk.bold(
               chalk.red(depPackageJson.version)
             )}) \n\n` +
-            `This is known to cause hard-to-debug issues.\n` +
-            `Try following these steps:\n\n` +
+            `Manually installing incompatible versions is known to cause hard-to-debug issues.\n` +
+            `To fix the dependency tree, try following the steps below in the exact order:\n\n` +
             `  ${chalk.cyan('1.')} Delete ${chalk.bold(
               'package-lock.json'
             )} (${chalk.underline('not')} ${chalk.bold(
@@ -113,7 +114,8 @@ function verifyPackageTree() {
             )} or ${chalk.bold(
               'yarn'
             )}, depending on the package manager you use.\n\n` +
-            `If this has not helped, there are a few other things to try:\n\n` +
+            `In most cases, this should be enough to fix the problem.\n` +
+            `If this has not helped, there are a few other things you can try:\n\n` +
             `  ${chalk.cyan('5.')} If you used ${chalk.bold(
               'npm'
             )}, install ${chalk.bold(
@@ -123,7 +125,7 @@ function verifyPackageTree() {
             `  ${chalk.cyan('6.')} Check if ${chalk.bold(
               maybeDep
             )} is outside your project directory.\n` +
-            `     For example, you might have installed something accidentally in your home folder.\n\n` +
+            `     For example, you might have accidentally installed something in your home folder.\n\n` +
             `  ${chalk.cyan('7.')} Try running ${chalk.bold(
               `npm ls ${dep}`
             )} in your project folder.\n` +
@@ -135,7 +137,7 @@ function verifyPackageTree() {
             `If nothing else helps, add ${chalk.bold(
               'SKIP_PREFLIGHT_CHECK=true'
             )} to an ${chalk.bold('.env')} file in your project.\n` +
-            `This permanently disables this preflight check in case you want to proceed anyway.\n\n` +
+            `That would permanently disable this preflight check in case you want to proceed anyway.\n\n` +
             chalk.cyan(
               `P.S. We know this message is long but please read the steps above :-) We hope you find them helpful!\n`
             )

From 851feb72a3d5a0118e61b05c137fb83af18309d8 Mon Sep 17 00:00:00 2001
From: Dan <dan.abramov@gmail.com>
Date: Sat, 13 Jan 2018 15:36:53 +0000
Subject: [PATCH 6/6] Fix lint

---
 packages/react-scripts/scripts/utils/verifyPackageTree.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/react-scripts/scripts/utils/verifyPackageTree.js b/packages/react-scripts/scripts/utils/verifyPackageTree.js
index 55dc7fbd99b..87f6acc1157 100644
--- a/packages/react-scripts/scripts/utils/verifyPackageTree.js
+++ b/packages/react-scripts/scripts/utils/verifyPackageTree.js
@@ -6,6 +6,8 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+'use strict';
+
 const chalk = require('chalk');
 const fs = require('fs');
 const path = require('path');