Upgrade to Angular v19 with hybrid rendering rollout to Firebase App Hosting fails in google cloud build

Environment Angular-ssr v18 deployed on Firebase App Hosting. When a new version of the app is uploaded to Github the rollout to App Hosting is triggered automatically, which includes the build process by google cloud build. No problem.

Upgraded the app to Angular v 19 and implemented hybrid rendering with server routing. Below its implementation. And I included "outputMode": "server" in angular.json build options.

// app.routes.server.ts
import { RenderMode, ServerRoute } from '@angular/ssr';
export const serverRoutes: ServerRoute[] = [
  {
    path: '',
    renderMode: RenderMode.Client,
  },
  {
    path: 'about',
    renderMode: RenderMode.Prerender,
  },
  {
    path: 'contact',
    renderMode: RenderMode.Prerender,
  },
  {
    path: 'help',
    renderMode: RenderMode.Prerender,
  },
  {
    path: 'privacy',
    renderMode: RenderMode.Prerender,
  },
  {
    path: 'terms',
    renderMode: RenderMode.Prerender,
  },
  {
    path: '**',
    renderMode: RenderMode.Server,
  },
];

When I build the app locally (ng build) no problem. Saw that the build generated a routes json file in the dist folder

// prerendered-routes.json
{
  "routes": {
    "/about": {},
    "/contact": {},
    "/help": {},
    "/privacy": {},
    "/terms": {}
  }
}

When I upload the app to Github it triggers the build process in google cloud build. And this build fails with the following error message.

Step #2: "outputPaths": {"
Step #2: "root": "file:///workspace/dist/vogel-bazaar",
Step #2: "browser": "file:///workspace/dist/vogel-bazaar/browser",
Step #2: "server": "file:///workspace/dist/vogel-bazaar/server"
Step #2:   },
Step #2:   "prerenderedRoutes": {
Step #2:     "/about": {},
Step #2:     "/contact": {},
Step #2:     "/help": {},
Step #2:     "/privacy": {},
Step #2:     "/terms": {}
Step #2:   }
Step #2: }
Step #2: file:///layers/google.nodejs.firebaseangular/npm_modules/node_modules/zod/lib/index.mjs:587
Step #2:                 const error = new ZodError(ctx.common.issues);
Step #2:                               ^
Step #2: 
Step #2: ZodError: [
Step #2:   {
Step #2:     "code": "invalid_type",
Step #2:     "expected": "array",
Step #2:     "received": "object",
Step #2:     "path": [
Step #2:       "prerenderedRoutes"
Step #2:     ],
Step #2:     "message": "Expected array, received object"
Step #2:   }
Step #2: ]


Step #2: ERROR: failed to build: exit status 1

Any suggestions.

I removed the prerendered routes but got an empty object. Same problem in google cloud build.

Follow next steps

Step 1:

In your project run

npm install -D @apphosting/adapter-angular@17.2.11

This will install the latest adapter with this fix merged in.

Make sure this libs has been added to your package.json

Step 2:

Add this additional line in your package.json scripts:

    {
     "scripts": {
         ...
         "apphosting:build": "FRAMEWORK_VERSION=19 apphosting-adapter-angular-build"
      }
    }

Step 3: Commit these changes to your repository and kickoff a new rollout