CLI ignores the serve port in angular.json

[sebastian-zarzycki-apzumi]

Description: When serving the application, the command executed as ionic serve translates to ng run app:serve --host=localhost --port=8100 or something similar. The port is enforced in commandline. When the port for serve target is specified in angular.json, it is ignored (or overwritten by commandline). The port shouldn't be enforced this way. Perhaps it shouldn't even be applied in commandline, but rely on defaults provided in respective framework's config (or added only as last resort, if no such default is provided).

I know the port can be still passed via commandline, but the exact purpose of written and maintained config (for different environments) is so that we don't have to do that (error-prone).

Steps to Reproduce: Configure port in your angular.json:

        "serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
            "browserTarget": "app:build",
            "port": 7777
          }

And execute ionic serve.

Output: Observe the app still launching on 8100.

My ionic info:

Ionic:

   Ionic CLI                     : 6.11.9 (/opt/local/lib/node_modules/@ionic/cli)
   Ionic Framework               : @ionic/angular 5.3.3
   @angular-devkit/build-angular : 0.1001.0
   @angular-devkit/schematics    : 10.1.0
   @angular/cli                  : 10.1.0
   @ionic/angular-toolkit        : 2.3.3

Cordova:

   Cordova CLI       : 10.0.0
   Cordova Platforms : 6.0.0, android 9.0.0, browser, ios 6.1.1
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 5.0.0, (and 12 other plugins)

Utility:

   cordova-res : 0.15.1
   native-run  : 1.1.0

System:

   Android SDK Tools : 26.1.1 (/Users/rattkin/Library/Android/sdk)
   ios-deploy        : 1.10.0
   ios-sim           : 8.0.2
   NodeJS            : v12.18.3 (/opt/local/bin/node)
   npm               : 6.14.8
   OS                : macOS Catalina
   Xcode             : Xcode 12.0 Build version 12A7209

Other Information:

[imhoffd]

The Ionic CLI needs to know the port in order to know when the dev server is ready so that it can offer features like opening the browser and livereload/deployment onto mobile devices.

If you prefer using the port in your configuration file, then just use the Angular CLI directly.

[sebastian-zarzycki-apzumi]

Of course it needs to know the port. But why can't it read it from the configuration file? (this, or other one).

How should I use Angular CLI directly, and what are the drawbacks?

[imhoffd]

No, reading from the Angular config file is something I want to avoid. It would make the Ionic CLI more brittle and the config file can get quite complex.

For ionic serve (not ionic cordova run), you can just use ng serve. Here's the docs: https://angular.io/cli

There's not really any drawbacks for regular serve, but if you want to use ionic cordova run, you'll lose out on livereload/deployment to mobile devices like I mentioned.

[DutchKevv]

I couldn't find it in the docs.. (sorry)

How to add the port to the ionic.config.json for example, or another config? Its handy when you inject multiple params like port etc. It can be given as a param (--port), but some setups its easier to just create a config file before build / serve

If angular.json is ignored, it would be nice to be able to create ionic config files on the fly.

Thanks