Repository navigation
fix: import ionic utilities - #6
Conversation
|
md3 and ios27 have the same root imports. |
|
Sorry, I completely missed this PR! This is an excellent contribution—thank you for investigating the bundle-size impact and putting this together. I really like this approach. I verified that the checks pass with Ionic 9. However, with Ionic 8.8.1, which we still support, |
|
Hey, The runtime imports use |
|
Thanks for the quick update! I’ll merge this now and review your PRs in the other repositories next. Really appreciate your contribution! |
npm beta publishedCI passed for the merge commit npm install @rdlabo/ionic-theme-utils@0.1.2-beta.pr6.shabf561e7dd38b |
Problem
The runtime imports (
createAnimation,createGesture, the lifecycle constants) come from the@ionic/coreroot, which is Ionic's lazy-loader build. Apps that use the custom elements build (Ionic 9 Angular, Ionic 8 standalone, React, Vue) then also bundle Stencil's lazy loader. Itsimport(`./${bundleId}.entry.js`)makes esbuild emit every Ionic component as an extra chunk that is never loaded, and the app gets a second copy of Ionic's shared code. esbuild also warns:The glob pattern import("./**/*.entry.js*") did not match any files.Measured in an Angular 22 + Ionic 9 app (esbuild) with ionic-theme-ios26 9.4.0, ionic-theme-md3 9.1.1 and ionic-theme-utils 0.1.1:
@ionic/core/componentsChanges
src/: all imports from@ionic/corenow use@ionic/core/components. It exports the same functions, andcustom-elements.d.tsre-exports all types. Ionic 9's own@ionic/angularimports the root only in its lazy variant.rdlabo-check-esmfails when a published.jsfile imports the@ionic/coreroot, so themes that runtest:esmcatch a regression in CI. There is a new case incheck-esm.test.mjs.Trade-off
Apps that still use the lazy-loader build get a small duplicate of these utilities instead.