javascript - AngularJS でサブモジュールを宣言する方法

Question

AngularJS で大規模なプロジェクトに取り組んでいると、コードを機能別に整理するのが好きであることがわかりました。
つまり、認識可能な機能 X がある場合 (特に再利用可能な場合)、ディレクトリ X を作成し、その機能に属するすべてのコントローラー、サービス、およびその他の部分をそこに配置します。また、X という新しいモジュールを宣言し、ディレクトリ X 内のすべてをそのモジュールに割り当てます。

ディレクトリ構造は次のようになります。

scripts/
  app.js
  controllers/
  services/
  directives/
  filters/
  X/
    controllers/
    services/
    directives/
    filters/

app.jsには、メイン モジュールの宣言があります。

angular.module('myApp', ['X']);

X/ のすべてのコントローラーなどはモジュール 'X' に属しています。つまり、これらのファイルで次のようにモジュール 'X' を取得します。

var X = angular.module('X');

モジュール「X」を宣言する場所がわかりません。

私が持っていたいくつかのアイデア：

• コントローラー/サービス/...の1つで宣言し、他のコントローラーなどでフェッチすることもできますが、そのコントローラー/サービス/...を選択するロジックが見当たらないため、正しく聞こえません。また、他の前に index.html に含めるように注意する必要があります。私はこの考えが悪いと思います。
• app.js に宣言を入れることができるので、app.js は以前のアイデアよりも
  angular.module('myApp', ['X']); angular.module('X', [/*some dependencies could go here*/]);
  このアイデアの方が優れているように見えますが、モジュール宣言がディレクトリ X の外にあるのは好きではありません。
• ディレクトリ X/ にファイル main.js を作成し、その中にモジュール X の宣言を入れます。ディレクトリ X/ の他のファイルの前に、このファイルを index.html に含めるように注意する必要があります。
  私はこのソリューションが一番好きです。

これを行うより良い方法はありますか？