awdorrin
awdorrin

Reputation: 423

How to publish "Angular and ASP.Net Core" template from VS2022

I am trying to deploy a sample .net8/Angular app that I created from the "Angular and ASP.Net Core" template provided by Visual Studio 2022 from GitLab to a CloudFoundry server.

However, I don't think the template is configured correctly, for the dotnet publish

The template creates two projects: MyTest.Server and mytest.client. In my gitlab-ci.yml I am trying to execute the following commands:

I see the client and server projects being built in the publish step

But, when I deploy this to Cloud Foundry, while the back-end server starts up, according to the logs, it does not appear to be hosting the Angular app, as I get a 404 error when connecting to the URL. Example error: No webpage was found for the web address: https://mytest.my-cloud-foundry-server.com (HTTP ERROR 404)

When I run from Visual Studio, everything starts up as expected, back-end runs, front-end starts with ng serve browser starts up and displays the page, etc.

Other than going back to the older ASP.Net/Angular template that I've been using since .net 3.1, through .net 6... I'm not sure what to do and not having much luck searching yet.

I am thinking this may be because the angular client is being published to a dist folder, while the publish is using a wwwroot/browser folder... but I don't see where that browser folder is being created...

Upvotes: 1

Views: 692

Answers (1)

awdorrin
awdorrin

Reputation: 423

The 'Angular and ASP.Net Core' project template available in Visual Studio 2022 currently defaults to Angular 15.

When updating Angular, there were changes involving @angular-devkit/build-angular:application introduced during Angular 17 that were meant to 'simplify' support of SSR and browser side applications. This change moved all angular client code into a 'browser' folder which broke every Angular app that does not use SSR.

In Dec 2023 a change was introduced to allow overriding this with a setting in the angular.json file:

  "architect": {
    "build": {
      "builder": "@angular-devkit/build-angular:application",
      "options": {
        "outputPath": {
          "base": "dist/your-app.client",
          "browser": ""              <------------- This line here
        },

Upvotes: 0

Related Questions