add logging of existing default port process on start

packages/react-dev-utils/README.md

@@ -142,6 +142,22 @@ compiler.plugin('done', function(stats) {
 });
 ```
 
+#### `getProcessForPort(port: number): string`
+
+Finds the currently running process(es) on `port`.
+Returns a string containing the name and directory, e.g.,
+
+```
+create-react-app
+in /Users/developer/create-react-app
+```
+
+```js
+var getProcessForPort = require('react-dev-utils/getProcessForPort');
+
+getProcessForPort(3000);
+```
+
 #### `openBrowser(url: string): boolean`
 
 Attempts to open the browser with a given URL.  

packages/react-dev-utils/getProcessForPort.js

@@ -0,0 +1,59 @@
+var chalk = require('chalk');
+var execSync = require('child_process').execSync;
+var path = require('path');
+
+var execOptions = { encoding: 'utf8' };
+
+function isProcessAReactApp(processCommand) {
+  return /^node .*react-scripts\/scripts\/start\.js\s?$/.test(processCommand);
+}
+
+function getProcessIdsOnPort(port) {
+  return execSync('lsof -i:' + port + ' -P -t', execOptions).match(/(\S+)/g);
+}
+
+function getPackageNameInDirectory(directory) {
+  var packagePath = path.join(directory.trim(), 'package.json');
+
+  try {
+    return require(packagePath).name;
+  } catch(e) {
+    return null;
+  }
+
+}
+
+function getProcessCommand(processId, processDirectory) {
+  var command = execSync('ps -o command -p ' + processId + ' | sed -n 2p', execOptions);
+
+  if (isProcessAReactApp(command)) {
+    const packageName = getPackageNameInDirectory(processDirectory);
+    return (packageName) ? packageName + '\n' : command;
+  } else {
+    return command;
+  }
+
+}
+
+function getDirectoryOfProcessById(processId) {
+  return execSync('lsof -p '+ processId + ' | grep cwd | awk \'{print $9}\'', execOptions);
+}
+
+function getProcessForPort(port) {
+  try {
+    var processIds = getProcessIdsOnPort(port);
+
+    var processCommandsAndDirectories = processIds.map(function(processId) {
+      var directory = getDirectoryOfProcessById(processId);
+      var command = getProcessCommand(processId, directory);
+      return chalk.cyan(command) + chalk.blue('  in ') + chalk.cyan(directory);
+    });
+
+    return processCommandsAndDirectories.join('\n  ');
+  } catch(e) {
+    return null;
+  }
+}
+
+module.exports = getProcessForPort;
+

packages/react-dev-utils/package.json

@@ -14,6 +14,7 @@
     "clearConsole.js",
     "checkRequiredFiles.js",
     "formatWebpackMessages.js",
+    "getProcessForPort.js",
     "InterpolateHtmlPlugin.js",
     "openChrome.applescript",
     "openBrowser.js",

packages/react-scripts/scripts/start.js

@@ -26,6 +26,7 @@ var detect = require('detect-port');
 var clearConsole = require('react-dev-utils/clearConsole');
 var checkRequiredFiles = require('react-dev-utils/checkRequiredFiles');
 var formatWebpackMessages = require('react-dev-utils/formatWebpackMessages');
+var getProcessForPort = require('react-dev-utils/getProcessForPort');
 var openBrowser = require('react-dev-utils/openBrowser');
 var prompt = require('react-dev-utils/prompt');
 var config = require('../config/webpack.config.dev');
@@ -267,9 +268,11 @@ detect(DEFAULT_PORT).then(port => {
   }
 
   clearConsole();
+  var existingProcess = getProcessForPort(DEFAULT_PORT);
   var question =
-    chalk.yellow('Something is already running on port ' + DEFAULT_PORT + '.') +
-    '\n\nWould you like to run the app on another port instead?';
+    chalk.yellow('Something is already running on port ' + DEFAULT_PORT + '.' +
+      ((existingProcess) ? ' Probably:\n  ' + existingProcess : '')) +
+      '\n\nWould you like to run the app on another port instead?';
 
   prompt(question, true).then(shouldChangePort => {
     if (shouldChangePort) {