How to design two modules include the same dependency issue in angularjs

Question

I have an app module which include another modules for example module a and b. But both module a and b depends on module c. See the followings

var app = angular.module('app', ['a', 'b']);

app.controller('AppCtrl', function(Containner) {
  console.log(Containner); //Avaiable
});

var a = angular.module('a', ['c']);

a.controller('ACtrl', function(Containner) {
  console.log(Containner); //Avaiable
});

var b = angular.module('b', ['c']);

b.controller('BCtrl', function(Containner) {
   console.log(Containner); //Avaiable
});

var c = angular.module('c', []);

c.factory('Containner', function() {
  return {
    test: 'test'
  }
});

From what I understand, you only need to include a module once and then you can access it in other module even you do not include it as its dependency. See the followings

var app = angular.module('app', ['a', 'b']);

app.controller('AppCtrl', function(Containner) {
  console.log(Containner);
});

var a = angular.module('a',[]);

a.controller('ACtrl', function(Containner) {
  console.log(Containner); //YOU CAN STILL GET IT
});

var b = angular.module('b', ['c']);

b.controller('BCtrl', function(Containner) {
   console.log(Containner);
});

var c = angular.module('c', []);

c.factory('Containner', function() {
  return {
    test: 'test'
  }
});

Module A does not has C as its dependency, but it still can access C's service. That is, I assume as long as you include C in one place, you can use in any other modules as long as somewhat they are all included in the angular application.

I prefer the first piece of code since each module clearly inform developers its own dependency. However, it seems redundant since you just need to include once and it will be available in other place. What is the best practise for this situation and how angular handles the duplicated dependency behind the scenes.

Answer 1

The first way is absolutely better for a couple reasons.

First of all, it is very clear and doesn't rely on any mysterious, uncommunicated expectations that another module is including its dependencies for it.

Second, with the intention of reusability being a core aspect of modular design, it would be necessary if you want to use the module in an app where module 'b' doesn't exist.

I would say the best practice is for a module to always and only list the modules it uses directly.

If app uses a and b but not c then it should list its dependences as ['a', 'b'] but not c.

If a uses c then it should list its dependencies as ['c']

Code should be written to be as clear as possible, and leave a programmer asking as few questions as possible. (I really don't want to wonder why module c is not being included if it is being referenced)