feat(serve): Persist serve options in angular-cli.json

Author: delasteve

packages/angular-cli/commands/serve.ts

@@ -1,9 +1,14 @@
 const PortFinder = require('portfinder');
 const Command = require('../ember-cli/lib/models/command');
+import { CliConfig } from '../models/config';
 
-PortFinder.basePort = 49152;
+const config = CliConfig.fromProject();
 
-const defaultPort = process.env.PORT || 4200;
+const defaultLiveReloadPort = config.get('defaults.serve.liveReloadPort');
+const defaultPort = process.env.PORT || config.get('defaults.serve.port');
+const defaultHost = config.get('defaults.serve.host');
+
+PortFinder.basePort = defaultLiveReloadPort;
 
 export interface ServeTaskOptions {
   port?: number;
@@ -42,9 +47,9 @@ const ServeCommand = Command.extend({
     {
       name: 'host',
       type: String,
-      default: 'localhost',
+      default: defaultHost,
       aliases: ['H'],
-      description: 'Listens only on localhost by default'
+      description: `Listens only on ${defaultHost} by default`
     },
     { name: 'proxy-config',         type: 'Path',                          aliases: ['pc'] },
     { name: 'watcher',              type: String,  default: 'events',      aliases: ['w'] },
@@ -65,7 +70,7 @@ const ServeCommand = Command.extend({
       name: 'live-reload-port',
       type: Number,
       aliases: ['lrp'],
-      description: '(Defaults to port number within [49152...65535])'
+      description: `Finds the first open port number within [${defaultLiveReloadPort}...65535]`
     },
     {
       name: 'live-reload-live-css',
@@ -103,7 +108,7 @@ const ServeCommand = Command.extend({
     },
     { name: 'i18n-file',       type: String, default: null },
     { name: 'i18n-format',     type: String, default: null },
-    { name: 'locale',         type: String, default: null }
+    { name: 'locale',          type: String, default: null }
   ],
 
   run: function(commandOptions: ServeTaskOptions) {

packages/angular-cli/lib/config/schema.d.ts

@@ -12,7 +12,7 @@ export interface CliConfig {
     apps?: {
         root?: string;
         outDir?: string;
-        assets?: string;
+        assets?: string | string[];
         deployUrl?: string;
         index?: string;
         main?: string;
@@ -23,11 +23,17 @@ export interface CliConfig {
         /**
          * Global styles to be included in the build.
          */
-        styles?: string[];
+        styles?: (string | {
+            [name: string]: any;
+            input?: string;
+        })[];
         /**
          * Global scripts to be included in the build.
          */
-        scripts?: string[];
+        scripts?: (string | {
+            [name: string]: any;
+            input?: string;
+        })[];
         /**
          * Name and corresponding file for environment config.
          */
@@ -75,5 +81,10 @@ export interface CliConfig {
             pipe?: boolean;
             service?: boolean;
         };
+        serve?: {
+            port?: number;
+            liveReloadPort?: number;
+            host?: string;
+        };
     };
 }

packages/angular-cli/lib/config/schema.json

@@ -227,6 +227,23 @@
               "default": true
             }
           }
+        },
+        "serve": {
+          "type": "object",
+          "properties": {
+            "port": {
+              "type": "number",
+              "default": 4200
+            },
+            "liveReloadPort": {
+              "type": "number",
+              "default": 49152
+            },
+            "host": {
+              "type": "string",
+              "default": "localhost"
+            }
+          }
         }
       },
       "additionalProperties": false

tests/e2e/tests/misc/default-port.ts

@@ -0,0 +1,20 @@
+import { request } from '../../utils/http';
+import { killAllProcesses } from '../../utils/process';
+import { ngServe } from '../../utils/project';
+import { updateJsonFile } from '../../utils/project';
+
+export default function() {
+  return Promise.resolve()
+    .then(() => updateJsonFile('angular-cli.json', configJson => {
+      const app = configJson.defaults;
+      app.serve = { port: 4201 };
+    }))
+    .then(() => ngServe())
+    .then(() => request('http://localhost:4201/'))
+    .then(body => {
+      if (!body.match(/<app-root>Loading...<\/app-root>/)) {
+        throw new Error('Response does not match expected value.');
+      }
+    })
+    .then(() => killAllProcesses(), (err) => { killAllProcesses(); throw err; });
+}