Is it possible to make CSS modularization to reduce main css file size?

Ionic Framework ionic-v3
1

My PWA is getting a css file with 1.930KB after a production build. It’s too large and it is compromising the loading performance of my app!

I’m using lazy loading and therefore modularization. My pages and components are separated but the css file still is only one. One huge css file!

How could I modularize this css into several files so that each part of the css it is loading with the respective module?

1 Like
2

The problem was caused by the creation of custom colors. Each custom color increases too much the size of the css.

The solution was to remove the custom colors. As a side effect I cannot use the “color” attribute with customized colors. Therefore is necessary to implement specific css colors for each component.

1 Like
3

I’ll add that *ngClass if fully workable now for a little time.