Multiple application under single project in Angular 6

Question

How to create multiple application under single project in Angular 6? In new angular.json file, there is no "app":[] array, where before we used to create/add multiple applications manually. Also there is no proper documentation I found at this stage, which elaborate how to create multiple application in single project. Any help would be appreciated. Thank you.

Answer 1

Like @JB Nizet said... you can use generate application ( https://github.com/angular/angular-cli/wiki/generate-application )

ng generate application <application-name>

to generate an application in the projects folder, and then serve it using

ng serve --project <application-name>

Similarly, you can create component libraries using ng generate library ( https://github.com/angular/angular-cli/wiki/generate-library )

ng generate library <library-name>

For common components used between projects. Both of which get installed into the /projects folder unless you changed the projects root when doing ng new .

Answer 2

If you have a project with multiple applications, use angular upgrade guide ( https://update.angular.io/ ) instructions to upgrade your application. One of the step while performing upgrade is to run

ng upgrade @angular/cli

(once you upgrade your @angular/cli to v6+). This will generate new angular.json file using your existing angular-cli.json file for multiple applciations.

Upgrade Angular CLI

OR

Manually edit your angular.json to add new application to the existing project. Editing JSON file for Another Application .

ng serve --project="second-app"

ng build --prod --project="second-app" // build prod app

Answer 3

Create a workspace with --createApplication="false"

ng new MultipleApps --createApplication="false"
cd MultipleApps  

use ng generate application to add as many apps

ng generate application app1
ng generate application app2

To run the app use the ng serve

ng serve app1

Source Angular multiple projects

Answer 4

To get my application working I removed everything from the main app.component.html file except for the

<router-outlet></router-outlet>. 

Then I added a route to my app-routing.module.ts file:

{path: '**', redirectTo: 'newApp'}

with nothing in the main app.component the application will automatically redirect to your 'newApp'