Search code examples
c#angularasp.net-core.net-6.0angular13

How deploy Asp.Net Core 6 + Angular SPA locally


The problem:

I have created an angular freontend app and an asp.net core backend app using the angular template for visual studio.

My goal:

I want to share my backend asp.net core 6 application and my Angular 13 frontend application, so that someone can test the app on another computer, without having to build or install dependencies.

Is there any way to make the asp.net core application serve the index.html file? Would this suffice? How would I achieve this?

So far I have tried this:

app.UseStaticFiles(new StaticFileOptions {
    FileProvider = new PhysicalFileProvider(builder.Environment.ContentRootPath),
    RequestPath = "/index.html"
});

app.UseRouting();

app.MapFallbackToFile("index.html"); ;

app.MapHub<MainHub>("/main");

I then ran the following command to build the app:

dotnet build -r win-x64 -c Release

I opened the resulting .exe file and opened a browser to the localhost:5000 uri.

However all I get is a 404 Not Found status code.


Solution

  • I have figured it out.

    I erroneously was running the command to build and not the command to publish the application.

    The following command:

    dotnet publish -r win-x64 -c Release
    

    did the trick. It created a publish folder within the Release build directory folder. There, inside the standrd webcontent path wwwroot, were all the necessary angular files, the web app needs to serve.

    Then I changed my code to:

    app.UseStaticFiles();
    app.UseRouting();
    
    app.MapFallbackToFile("index.html", new StaticFileOptions() {
        ServeUnknownFileTypes = true,
        FileProvider = new PhysicalFileProvider(builder.Environment.WebRootPath)
    });
    
    app.MapHub<MainHub>("/main");
    

    this seems to not be necessary, however, since these are the standard configurations.