Losing my styles on PrimeNG update from 9 to 10

user_3157653 0
Viewed 3172

Upon upgrade from PrimeNG 9 to PrimeNG X styles are broken. ui-something styles are renamed to p-something. There are no errors in the console and the behavior of some components is improved (e.g. p-inputNumber) - so it looks like this is a style only issue.

Styles are much improved but still quite broken if I add a theme in angular.json to styles: "node_modules/primeng/resources/themes/nova/theme.css".

I would appreciate very much if somebody can provide some guidance on how to solve this:

  1. fix styles one by one (this would be like creating styles again for the whole app)

  2. wait for PrimeNG community to fix some bugs and transition from 9 to X will be a drop-in

  3. wait for PrimeNG community to provide a guide for the upgrade

primeng angular
1 Answers

The solution seems to be a combination of 1.) and 3.).

They have introduced breaking changes with primengX. Transition guides here and here. I found it helpful to look at their getting started for primengX LTS here even though we are using CE.

In addition to upgrading the packages you have to upgrade the styles (angular.json) in their example its LTS and in ours its:

"node_modules/primeng/resources/primeng.css",
"node_modules/primeng/resources/themes/saga-blue/theme.css",
"node_modules/primeng/resources/primeng.min.css"

And now you "only" have to check each component about the remaining broken styles.

user_31576530
Related