Production Build Routes Require 2 Clicks To Render Parent-Child Components

[manavsehgal]

This is a weird issue. I have added another set of parent-child components with routes configured as prescribed in starter. Works fine when I am running dev server (npm start).

However when I build:prod and serve:prod, the routes seem to require 2 clicks to show up content beyond first parent component referred to in the route. The first click seems to render only parent component until @Input() is triggered to get child components on second click!

Anyone else facing this issue?

[PatrickJS]

that's normal see angular/angular#6160

[manavsehgal]

Thanks for linking the issue with main angular repo. I am reading more issues of similar nature to get grips on this one. There needs to be a workaround, otherwise we cannot have a situation where nested components are not allowed using routes to parent. Will keep this thread updated with my findings.

[PatrickJS]

can you push the repo to github so I can see what you're doing?

[manavsehgal]

My main repo has a lot of unrelated code. I will setup something with simple parent-child components so we can focus on the problem. It will also help us test and isolate the issue.

[PatrickJS]

yeah that would be awesome 👍

[manavsehgal]

Ok. Hope I have done this correctly. I have created a fork of your repo and pushed a new branch with sample code. [Repo removed]

I can replicate the above mentioned issue in this simple example.

[PatrickJS]

I'm installing it now

[PatrickJS]

@manavsehgal can you remove the CommonsChunkPlugin for common then it should work

[manavsehgal]

Yes it works now. Many thanks.

[PatrickJS]

the problem was how CommonsChunkPlugin and the order the polyfills were loaded from what I can see