-3

I am working angular 13 application and trying to integrate universal. I have followed the official document https://angular.io/guide/universal to integrate.

Angular version

Angular CLI: 13.3.8
Node: 14.19.3
Package Manager: npm 6.14.17
OS: linux x64

Angular: 13.3.11
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, platform-server
... router, service-worker

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1303.8
@angular-devkit/build-angular   13.3.8
@angular-devkit/core            13.3.8
@angular-devkit/schematics      13.3.8
@angular/cdk                    13.3.9
@angular/cli                    13.3.8
@angular/material               13.3.9
@nguniversal/builders           13.1.1
@nguniversal/express-engine     13.1.1
@schematics/angular             13.3.8
rxjs                            7.4.0
typescript                      4.6.4

After integrating all when I hit the "ng run Frontend:serve-ssr" command in a terminal, then I get the following error.

Error

TypeError [ERR_INVALID_URL]: Invalid URL: null
at new NodeError (internal/errors.js:322:7)
at onParseError (internal/url.js:270:9)
at new URL (internal/url.js:346:5)
at new InitServ (/home/pc5/Documents/Restucture/frontend-universal/dist/Frontend/server/main.js:51443:17)
at Object.InitServ_Factory [as factory] (/home/pc5/Documents/Restucture/frontend-universal/dist/Frontend/server/main.js:52031:10)
at R3Injector.hydrate (/home/pc5/Documents/Restucture/frontend-universal/dist/Frontend/server/main.js:241212:35)
at R3Injector.get (/home/pc5/Documents/Restucture/frontend-universal/dist/Frontend/server/main.js:241031:33)
at injectInjectorOnly (/home/pc5/Documents/Restucture/frontend-universal/dist/Frontend/server/main.js:234492:33)
at ɵɵinject (/home/pc5/Documents/Restucture/frontend-universal/dist/Frontend/server/main.js:234496:61)
at injectArgs (/home/pc5/Documents/Restucture/frontend-universal/dist/Frontend/server/main.js:234576:23)
Saikrishna Rajaraman
  • 3,205
  • 2
  • 16
  • 29
Lakhvir Singh
  • 664
  • 4
  • 15
  • 35
  • 1
    can you please reproduce the problem in a small project and share it on github, or give us the part you think is causing the problem, we can't help you with only the error – Robert Jun 29 '22 at 17:38
  • 1
    There is not enough info to debug on our side. I advise you to make a minimal project and integrate universal and when everything is ok, add little by little all your components. If even the MVP doesn't work, then you can make a demo with it so we can try – Vega Jul 03 '22 at 13:59

1 Answers1

0

Check if you have converted all relative paths to absolute.

to use angular universal and take advantage of it's utilities like prerendering, you need to follow a set of rules. Check it out !

As server side do not have some objects defined like document, window, localstorage and ... when your code will be first rendered in server side, it will not be recognized and causes errors.

My personal suggestion how ever is to use if (typeof window !== 'undefined' && window.document) logic, hence you will use document object only in client side.

I used domino and didn't worked for me ...

Ryan
  • 72
  • 6