Ionic 3 every lazy loaded page requires a module....what?

#1

Disclaimer, I know lazy loading is in beta, but this feels like a bigger architecture thing. Please tell me if I’m wrong.

So, Angular modules, they’re great. A module is a feature area of your app, your one module can have multiple components, services, etc. It’s so great to be able to build reusable modules, where you can just copy and paste your feature folder into another app and use it. By using a feature module with a folder-by-feature approach you not only make reusing modules easy, you also create more isolated code (good for unit testing), and reduce spaghetti code. Here are some examples from the style guide.

https://angular.io/docs/ts/latest/guide/style-guide.html#!#04-09
https://angular.io/docs/ts/latest/guide/style-guide.html#!#04-06

In regular Angular, a lazy loaded module looks no different from an eagerly loaded one, you can still have a module with services and multiple components: https://angular.io/docs/ts/latest/guide/ngmodule.html#!#lazy-loaded-routing-to-a-module

In Ionic’s lazy loading it seems this isn’t the case. If I try to build multiple pages in one lazy loaded module, it fails with this error:

ts has a @IonicPage 
            decorator, but it does not have a corresponding "NgModule" at

So, I assume, this means I have to create a module file for every page I want lazy loaded. I can’t have a lazy loaded module with a service and two pages that share that service. I have to eagerly load all services.

Even worse every single page now needs it’s own module?! Why? How do I reconcile that with a folder-by-feature approach where each feature has it’s own module. Do I have to go back to old-timey folder-by-type where I have to look at a giant list of services and find mine and make a bunch of spaghetti code importing everywhere?

I’m really looking for someone to tell me why I’m wrong. We’ve used Ionic a lot over the years, but this feels like a fundamental flaw.

TL:DR New lazy loading seems to break far away from the Angular architecture. Please tell me why I’m wrong or how it will change.

9 Likes
#2

Maybe each feature area should have it’s own <nav> and then the other pages in that feature area could get pushed on there? I’m going to experiment with that. It would be fine to “reset” the root since it’s a whole new feature area. That is my current idea…we’ll see how that goes.

#3

I am also concerned about having a module for every page when sharing data with a service. . .

#4

Is there any update on this?

#5

I am also concerned about this approach. It does not feel tidy to have seperate module file for all the pages which logically belong to same group. Any updates on this issue?

#6

This is how it works. Ionic is “page based”. So I think it makes sense that a first go at lazy loading uses that as the base.

If you have a better suggestion, feel free to create a new topic where you describe how it would or should work.