1

my question is related with Angular 2 Modules (@NgModule).
Previously I’ve worked with angular 1.5.8 on huge business application and I’ve got used to Angular 1.x practices.

Important background:
Right now I'm developing something more then single application. It's going to be more like business platform. We set up common platform conventions for styling, naming, structure, REST, etc. Whole platform consist of one main application and some smaller apps closely related with it. Now I'm going to create baseline version of application and I would like it to be easy to customise (maybe better words are 'to decorate') for clients. I would also like to have each component as reusable as possible. Smaller application can partially utilise the same UI components (and I'm not talking only about components from shared module).

My question is:

  • Is it good idea to provide separate module for each significant component? - by 'significant component' I understand components which are pointed by Routes and shared (generic and stateless) components.

Angular docs examples describe feature modules but all contents inside those modules are not encapsulated with modules, they just use components which are added to feature module declarations:[] list.

Pros:

  • Ability to expose components dependencies in one place - let's assume that one component uses other component(s). If we have all dependencies listed in imports:[], we don't have to scroll over components template to find all of them
  • We have better control over our functional domains (I assume that we can treat module as functional domain) - code is better encapsulated because modules provide us export mechanism so we can easily declare public and private members. It reduces team communication overhead as it is clearly visible which component is public and which is just supporting component.
  • We create more reusable code - If we want to use particular component in other application (which also belongs to the platform) it's more comfortable to have it encapsulated in module - at first sight we see what are additional needed dependencies which also should be moved to our application.
  • We can keep flatter directory structure - Is that really advantage?
  • We can limit size of module declarations - it improves readability.

Cons:

  • More coding - we have to declare module for (almost) each component
    EDIT:
  • @NgModule mechanism abuse - i'm not sure but I can imagine that it could increase lazy-loaded module bootstrapping time

Project structure example

--/user-groups //user-groups is lazy loaded module
   --/user-groups-list
      --user-groups-list.component.ts // Public component
      --user-groups-list-filter-input.component.ts  // Private component - strong relation with user-groups-list.component
      --user-groups-list.module.ts
      --user-groups-list.html
      --user.groups-list.css
--user-groups.component.ts
--user-groups.module.ts // Router points to this module
--user-groups-routing.module.ts // Routing inside of  user-groups
--user-groups.service.ts // It's component service
--user-groups.html
--user.groups.css
5
  • What precisely is "@NgModule mechanism abuse"? Also this probably isn't a decision you need to make up-front, you can extract modules as you see the need. Commented Jan 30, 2017 at 11:21
  • @jonrsharpe - ok, but what about other developers (other teams) which are developing in the same time and often review baseline code in purpose of finding solutions to their problems? It will be easier for them to understand project dependencies if they have modules files. What is more I would like to have stable release of baseline app after some time. It should be well tested and rarely modified. Commented Jan 30, 2017 at 11:30
  • So what? You shouldn't take on extra requirements and technical overhead just because some other people might want it to be done differently (if they even do - have you validated that it makes it any easier?) If they're using the baseline app they have all the dependencies whether it's split into modules or not. And by all means modularise where appropriate before your "stable release", but that still doesn't mean you have to start from day one that way. Commented Jan 30, 2017 at 11:43
  • I guess my key point is you don't need to decide this now. Indeed spending time bikeshedding on the appropriate level of modularity is probably less valuable to your team and others than simply getting stuff built, and finding out for yourselves what feels most appropriate. This also allows you to get feedback from those other teams, if that's something that will help make those decisions. Extracting a module from an existing one is a pretty straightforward task, you're not tied in. Commented Jan 30, 2017 at 11:46
  • Thanks, for your comments :) Generally I would like to know Whether to have so many modules in Angular 2 app is not consider as a bad practice. I was also wondering if there is something else that I don't know (despite of those 2 cons I mentioned in post above) what will affect my app when it comes to number of modules. Commented Jan 30, 2017 at 13:39

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.