Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Upgrading to Angular 12 and NgBootstrap 10 #806

Merged
merged 1 commit into from
Sep 22, 2021
Merged

Conversation

softsimon
Copy link
Member

Let's test so nothing got broken on the site due to this upgrade.
NgBootstrap had to be upgraded to fit with Angular 12 and make sure that nothing broke using these components. (Typeahead, accordion)

@softsimon softsimon added this to the v2.3.0 milestone Sep 22, 2021
@softsimon softsimon requested a review from wiz September 22, 2021 11:26
@softsimon softsimon force-pushed the simon/angular-12-upgrade branch from 5db6980 to 095c546 Compare September 22, 2021 11:50
Copy link
Member

@wiz wiz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Apparently there was an option in Angular 11.1 that is now enabled by default in Angular 12 called "Critical CSS inlining" which causes CSS to be loaded asynchronously, so the initial page renders faster now, but looks really weird until a split second later when the CSS loads. To resolve this we need to configure the "Critical CSS inlining" using a webpack plugin. More information on these blog articles:

https://blog.ninja-squad.com/2021/05/12/angular-cli-12.0/
https://blog.ninja-squad.com/2021/01/21/angular-cli-11.1/

@softsimon softsimon force-pushed the simon/angular-12-upgrade branch from 095c546 to 17562ae Compare September 22, 2021 17:32
@softsimon softsimon force-pushed the simon/angular-12-upgrade branch from 17562ae to bbee2dc Compare September 22, 2021 19:57
Copy link
Member

@wiz wiz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tested ACK @ bbee2dc

Disabled the inlineCritical for now, will implement support for this in a separate PR later following the example in https://dzone.com/articles/critical-css-and-webpack-automatically-minimize-re

@wiz wiz merged commit 552540f into master Sep 22, 2021
@wiz wiz deleted the simon/angular-12-upgrade branch September 22, 2021 20:10
@softsimon softsimon mentioned this pull request Sep 25, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants