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

Prevent duplicated css output #4

Open
valioDOTch opened this issue May 17, 2018 · 2 comments
Open

Prevent duplicated css output #4

valioDOTch opened this issue May 17, 2018 · 2 comments

Comments

@valioDOTch
Copy link

valioDOTch commented May 17, 2018

Feature request
When building a dynamic package for an app, remove all CSS output, that is not part of the dynamic package
i.e. SCSS stemming from the application, its theme or the parent themes that was already loaded, when the application was loaded.

Reasoning
In our setup, we have a single app in our workspace. We use the dynamic package loader for additional app areas that are loaded depending on user configurations (e.g. depending on the company, there are additional menu entries).

If we build an app with a dynamic package, the build files are written to
workspace/build/[development|production|testing]/(appName)/(buildName)/resources/(dynPkgName)/(dynPkgName).css

However the CSS of this dynamically loadable package not only contains the code of the SCSS that is provided via the package, but also all of the SCSS that is part of the application (e.g. workspace/sass/var/all.scss), the application theme and the parent themes of that theme. In fact this is the major part of that particular CSS file (about 95%-100%).

From our perspective this is behaviour is bad, because

  1. it makes debugging the CSS a pain
  2. it creates unnecessary network overhead for end user devices
  3. it creates unnecessary performance overhead for end user devices
@valioDOTch
Copy link
Author

We could probably try to do this ourselves with some after-build task, but we consider this to be an issue that should be fixed in the package-loader package.

@valioDOTch
Copy link
Author

As a workaround for anyone who encounters the same problem:
We decided we will stop using scss in dynamic packages entirely (i.e. we move all scss into our main application and use dynamic packages solely for JS code).

For this we added an override for Ext.package.Entry which removes its loadStyle method
Ext.define("PWA.overrides.package.EntryWithLoadStyleMethodRemoved", { override: "Ext.package.Entry", loadStyle: ()=>{} });

This approach also allowed us to reduce our build time for the dynamic packages.
In each of our dynamic packages we changed the sass config in the package.json to "sass" : false,

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

No branches or pull requests

1 participant