.NET Core Angular 7 Server Side Rendering

Question

I'm trying to create a Angular 7 SSR using dotnet core to host it, the default template uses angular 5 and MS have documentation to get SSR running on that (which works fine) I have tried upgrading via a command line to angular 7 and start a new angular project and implement the SSR after but I always end up at the same issue, both ng build and ng build:SSR work fine from command line but when I come to run it from VS it times out (which I think has nothing to do with the issue) after it throws an error:

The thread 0x6608 has exited with code 0 (0x0).
The thread 0x1134 has exited with code 0 (0x0).
The thread 0x54bc has exited with code 0 (0x0).

The changes I made from NG5 SSR (https://go.microsoft.com/fwlink/?linkid=864501) following this (https://github.com/aspnet/Templating/issues/593) are:

startup.cs

options.BootModulePath = $"{spa.Options.SourcePath}/dist-server/main.bundle.js";

to

options.BootModulePath = $"{spa.Options.SourcePath}/dist-server/main.js";

Added the SSR project again to angular.json

 "ssr": {
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:server",
          "options": {
            "outputPath": "dist-server",
            "main": "src/main.server.ts",
            "tsConfig": "src/tsconfig.server.json"
          },
          "configurations": {
            "production": {
              "optimization": false,
              "outputHashing": "media",
              "sourceMap": false,
              "namedChunks": false,
              "extractLicenses": true,
              "vendorChunk": false,
              "bundleDependencies": "all",
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ]
            }
          }
        }
      }
    }

Change build:ssr within package.json scripts

"build:ssr": "ng build --configuration=production --project=ssr",

Code im running - https://github.com/TPJ11/DotnetNG7SSR

Has anyone got any idea what i'm doing wrong? feel like I've been banging my head against a wall on this :(

Answer 1

Right so not sure what it is that breaks the app but I have the work around.

1) Create a new .Net Core NG app and delete the ClientApp folder then create a blank angular 7 app via CMD called ClientApp ng new ClientApp

2) Follow angulars SSR setup guide up to step 3.

3) Install aspnet-prerendering npm i aspnet-prerendering

4) Swap the code from step 2c (main.server.ts) to use the code in Microsoft setup guide for main.server.ts

5) Open angular.json file and change the outputPath for build to dist and server's outputPath to dist-server

6) Open package.json and within scripts add "build:ssr": "ng run ClientApp:server"

7) Open tsconfig.server.json and tsconfig.app.json and change types to include node "types": ["node"]

8) Open Startup.cs and as shown in Microsoft setup guide add

spa.UseSpaPrerendering(options =>
{
    options.BootModulePath = $"{spa.Options.SourcePath}/dist-server/main.js";
        options.BootModuleBuilder = env.IsDevelopment()
            ? new AngularCliBuilder(npmScript: "build:ssr")
                : null;
    options.ExcludeUrls = new[] { "/sockjs-node" };
});