How to deploy app with ASP.NET Core and Angular through Visual Studio

Question

I have followed this tutorial: https://learn.microsoft.com/en-us/visualstudio/javascript/tutorial-asp-net-core-with-angular?view=vs-2022

I have created a solution containing a backend ASP.NET Core and angular client application.

For publish, I tried publishing to a folder and to a remote IIS server, but in both instances, only the ASP.NET is packed. In the publish output, I see that the angular app is being built, and I can run both from Visual Studio, but it just doesn't pack the files in the publish.

I also tried setting the output of angular into wwwroot folder of the backend app, it didn't do anything.

Hi, what do you mean it didn't do anything? Does it mean that you can't interact with the background when you use Angular? If so you can refer to stackoverflow.com/questions/56394751/…. If not, please state clearly. — Wenbin Geng
– Wenbin Geng, Commented Mar 14, 2023 at 9:55
It still didn't add the angular folder into the published folder. — mihZR
– mihZR, Commented Mar 15, 2023 at 20:17
About you want to set the output of angular to the wwwroot folder of the backend application can refer to this post <stackoverflow.com/questions/66161734/… asp-net-core-project>. — user20376806
– user20376806, Commented Mar 20, 2023 at 9:45

Imran Emon · Accepted Answer · 2023-03-12 13:55:18Z

1

If your frontend Angular project does not get published, you can manually build the Angular project in Production mode and copy the contents of dist folder to your wwwroot folder. Also, did you configure your .NET project to serve ANgular from wwwroot folder? You can do it like this in your Startup.cs file -

app.UseSpa(spa =>
{
    spa.Options.SourcePath = "ClientApp";
    if (env.IsDevelopment())
    {
        spa.UseAngularCliServer(npmScript: "start");
    }
});

answered Mar 12, 2023 at 13:55

Imran Emon

112 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

mihZR Over a year ago

I didn't do it manually. This tutorial explains it as it's all done together. That's why I'm asking, I'm trying to avoid manual copying each time I want to deploy.

Imran Emon Over a year ago

Try adding these lines in your projects .csproj file, inside PropertyGroup section: ` <SpaRoot>ClientApp\</SpaRoot> <DefaultItemExcludes>$(DefaultItemExcludes);$(SpaRoot)node_modules**</DefaultItemExcludes> ` This should add your angular app in dotnet build process. The SpaRoot property tells the dotnet publish command where to find the Angular app, and the DefaultItemExcludes property tells it to exclude the node_modules folder from the published output.

Collectives™ on Stack Overflow

How to deploy app with ASP.NET Core and Angular through Visual Studio

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related