Use detect-port to check if 3000 is already used.

Based on create-react-app and specifically
facebook/create-react-app#101

Author: STRML

bin/next-dev

@@ -4,6 +4,7 @@ import parseArgs from 'minimist'
 import { exists } from 'mz/fs'
 import Server from '../server'
 import clean from '../server/build/clean'
+import run from './util/run';
 
 const argv = parseArgs(process.argv.slice(2), {
   alias: {
@@ -21,8 +22,7 @@ const dir = resolve(argv._[0] || '.')
 clean(dir)
 .then(async () => {
   const srv = new Server({ dir, dev: true, hotReload: true })
-  await srv.start(argv.port)
-  console.log('> Ready on http://localhost:%d', argv.port)
+  await run(srv, argv.port)
 
   // Check if pages dir exists and warn if not
   if (!(await exists(join(dir, 'pages')))) {

bin/next-start

@@ -3,6 +3,7 @@
 import { resolve } from 'path'
 import parseArgs from 'minimist'
 import Server from '../server'
+import run from './util/run';
 
 const argv = parseArgs(process.argv.slice(2), {
   alias: {
@@ -18,10 +19,8 @@ const argv = parseArgs(process.argv.slice(2), {
 const dir = resolve(argv._[0] || '.')
 
 const srv = new Server({ dir })
-srv.start(argv.port)
-.then(() => {
-  console.log('> Ready on http://localhost:%d', argv.port)
-})
+
+run(srv, argv.port)
 .catch((err) => {
   console.error(err)
   process.exit(1)

bin/util/prompt.js

@@ -0,0 +1,15 @@
+import rl from 'readline';
+
+export default function (question) {
+  const rlInterface = rl.createInterface({
+    input: process.stdin,
+    output: process.stdout,
+  });
+
+  return new Promise((resolve) => {
+    rlInterface.question(question + '\n', function(answer) {
+      rlInterface.close();
+      resolve(answer);
+    });
+  });
+};

bin/util/run.js

@@ -0,0 +1,19 @@
+import prompt from './prompt';
+import detect from 'detect-port';
+import chalk from 'chalk';
+
+export default async function run(srv, desiredPort) {
+  const port = await detect(desiredPort);
+  if (port !== desiredPort) {
+    const question = chalk.red(`Something is already running at port ${desiredPort}.\n` +
+      `Would you like to run the app on port ${port} instead? [Y/n]`);
+    const answer = await prompt(question);
+    const shouldChangePort = (answer.length === 0 || answer.match(/^yes|y$/i));
+    if (!shouldChangePort) {
+      console.log(chalk.red('Exiting.'));
+      process.exit(0);
+    }
+  }
+  await srv.start(port);
+  console.log(`Ready on ${chalk.cyan(`http://localhost:${port}`)}`);
+}

gulpfile.js

@@ -26,7 +26,7 @@ gulp.task('compile', [
 ])
 
 gulp.task('compile-bin', () => {
-  return gulp.src('bin/*')
+  return gulp.src('bin/**/*.js')
   .pipe(cache('bin'))
   .pipe(babel(babelOptions))
   .pipe(gulp.dest('dist/bin'))

package.json

@@ -47,8 +47,10 @@
     "babel-preset-es2015": "6.16.0",
     "babel-preset-react": "6.16.0",
     "babel-runtime": "6.11.6",
+    "chalk": "^1.1.3",
     "cross-spawn": "4.0.2",
     "del": "2.2.2",
+    "detect-port": "^1.0.1",
     "glamor": "2.17.10",
     "glob-promise": "1.0.6",
     "htmlescape": "1.1.1",
@@ -59,6 +61,7 @@
     "react": "15.3.2",
     "react-dom": "15.3.2",
     "react-hot-loader": "3.0.0-beta.6",
+    "readline": "^1.3.0",
     "send": "0.14.1",
     "strip-ansi": "3.0.1",
     "url": "0.11.0",