ASP.Net Core MVC With Multiple Angular 2 Applications [closed]

Question

I am trying to prepare the structure for a project which I know will grow in complexity. I want to use ASP.Net Core MVC for the top level navigation. Within each of the main Views I want to place an Angular 2 Application.

I have started with this Yoman template to scaffold out a starting point Angular 2 with ASP.Net Core Template. This built and ran well.

In the root of my project I want to have an AngularApps folder and within that a folder for each Angular App, say 'Scheduling', 'Utilities', 'Equipment'.

There are a couple problems I cannot understand:

1. How do I configure Webpack?
2. Do I have a single dist folder within AngularApps?
3. Do I have a boot-client and boot-server file for each Angular 2 application within its respective app folder?

It seems to me a pragmatic approach to plan from the beginning to have multiple Angular 2 applications, each with a more focussed responsibility. I cannot find any clear examples of how to practically make this work though. I'm sure this would be valuable for many people.

Many thanks.

Answer 1

We had the same issue at our company and came up with this structure.

We have one master project for ASP.NET Core, and like you... we have the root folder named apps or AngularApps in your case. We then created separate projects for each angular app we developed. Each of these Angular apps are basic node projects that we use Angular CLI to build to project. This includes Webpack and a host of other great tools for your project.

Finally, in the Production build settings, we made our output directory of these angular projects set to a specific folder in the wwwroot folder of our master ASP.NET Core Project.

I hope this helps, let me know if you have any questions.