Convert Angular 2/3/4/5/6 project to Angular Universal

Question

I have just updated my project to work with Angular 5, and I have got a NodeJS setup on my hosting so I want to create an Angular Universal Application, I would like to convert my current Angular 5 project into a working Angular Universal project that I can setup on my hosting.

The only thing I found on this so far is this;

Convert Angular 4 web app to Angular Universal app I followed this and It gave me errors, I imagine due to the quick changing nature of Angular that the answer is most likely outdated, so I was wondering the best way to convert it.

Should I just use the starter seed and do the tedious work of adding all my code?

Answer 1

The best way to do this for me personally was add in all my components, services, modules into the universal-starter project, ensure I remove hammerjs or import it properly (for Material 2). I converted most of my components to have .module so I could use their lazy loading (not forgetting to add these paths properly in my routing file and in the static lazy loading path)

It only took a few hours and alot of that was just bug testing/fixing so it was pretty easy all in all.

Answer 2

I had the same issue several weeks ago. There is a Wiki on how to implement Universal into an Angular CLI project : https://github.com/angular/angular-cli/wiki/stories-universal-rendering Maybe that helps you out.

I found it the easiest to take the current Angular Universal Starter Kit and import all my Modules into a fresh installation. As the new starter is for Angular 5 CLI I hope it's future proof. We will see…