Angular universal SSR working on localhost but not working on netlify

Question

I am trying to learn Angular Universal using nestjs It seems to be working fine at my localhost port 4000 but when the build is made on Netlify I can see the site is working but the Angular Universal is not working.

I use npm run serve:ssr in my localhost to run the project. Whereas in netlify I have configured the build and deploy setting as below screenshot.

My live site click here

package.json

  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "dev:ssr": "ng run bharatas:serve-ssr",
    "serve:ssr": "node dist/bharatas/server/main.js",
    "build:ssr": "ng build --prod && ng run bharatas:server:production",
    "prerender": "ng run bharatas:prerender",
    "prebuild:ssr": "ngcc"
  },

server/app.module.ts

import { Module } from '@nestjs/common';
import { AngularUniversalModule } from '@nestjs/ng-universal';
import { join } from 'path';
import { AppServerModule } from '../src/main.server';

@Module({
  imports: [
    AngularUniversalModule.forRoot({
      bootstrap: AppServerModule,
      viewsPath: join(process.cwd(), 'dist/bharatas/browser')
    })
  ]
})
export class AppModule {}

server.ts

import 'zone.js/dist/zone-node';
import './server/main';
export * from './src/main.server';

Can you help me what I am doing wrong. Why can't I see content while I do view source ? Why it is working on only my localhost:4000

user_3704688 · Answer

First of all you need to install plugin in netlify dashboard: Angular Universal (https://github.com/netlify/netlify-plugin-angular-universal#readme).
But .toml file from docs wasn't working for me (see working configs below - netlify.toml)
Build settings:

Base directory: Not set
Build command: npm run prerender
Publish directory: dist/project-name/browser

netlify.toml

[build]
  command = "npm run prerender -- --c production && ng run project-name:serverless:production"
  publish = "dist/project-name/browser"

[[plugins]]
  package = "@netlify/plugin-angular-universal"

[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200

package.json

"scripts": {
  "ng": "ng",
  "start": "ng serve",
  "build": "ng build",
  "watch": "ng build --watch --configuration development",
  "test": "ng test",
  "prerender": "ng run project-name:prerender",
  "dev:ssr": "ng run project-name:serve-ssr",
  "build:ssr-prod": "ng build --configuration production && ng run project-name:server",
  "build:ssr": "ng build --configuration development && ng run project-name:server",
  "serve:ssr": "PORT=3333 node dist/project-name/server/main.js"
},

Angular universal SSR working on localhost but not working on netlify

1 Answers