ケース
大きなjavascriptプロジェクトをセットアップする最も便利な解決策を見つけようとしています。
要件は次のとおりです。
- モジュラー JavaScript: 必要に応じて、グローバル名前空間内の 1 つのオブジェクトのみ
- Bower コンポーネントとの互換性
- grunt との互換性: grunt によって行われるビルドとデプロイ ( contrib-useminまたはcontrib-requirejs )
驚いたことに、これは簡単ではない作業であることがわかりました。AMD を使用すると、次の問題が発生します。
- バウアー コンポーネントのロードは、常に簡単に行えるとは限りません。たとえば、Raphael は、ソースを変更せずに AMD を使用してロードすることはできません。依存関係リストをgitにプッシュするだけなので、bowerを使用する場合、これは実際にはオプションではありません。また、AMD をサポートしていない JavaScript ライブラリを読み込むと、shim することができますが、複数のファイル (jquery-ui など) で構成されていると問題が発生します。一緒にハックする必要があります。
- De requirejs オプティマイザーは、サイト スクリプトからライブラリを分離するオプションを許可せずに、すべてを 1 つのファイルにビルドします。正気と思われる何か。
AMD を使用していないときは、他の問題が発生します。
- 大規模なプロジェクトで依存関係を制御するにはどうすればよいですか?
可能な解決策
だから私は次のような解決策を考えています:
- 移植性を維持し、将来のユーザーに AMD を強制しないでください
- グローバル名前空間の混乱を防ぐ
- バウアーとの互換性を維持
- useminがgruntですべてをビルドできるようにする
require( <deps>, <factory> )
これは、基本的なモジュールの定義と注入を実装する および `define( , , ) 関数を定義する小さなスクリプトで構成されます。依存関係が一致しないスクリプトの非同期ロードまたはキューイングは実装されません。
さらに、匿名モジュールを使用する代わりに、名前付きモジュール パターンを使用して任意のモジュールを定義します。ただし、これにより最小限の移植性が犠牲になります。
これで、手動ロードと組み合わせて、 requirejsまたはその小さな依存性インジェクターを使用できるようになりました。<script src=""></script>
後者のオプションを使用する場合、次のようなものを使用して、ロードされた非 amd ライブラリを登録する必要があります。
define( 'raphael', [], function() { return Raphael; })
どう思いますか?私は正気なことをしていますか?車輪の再発明?不必要に複雑ですか?
アップデート
上記の目的を満たすために、アーモンド( https://github.com/jrburke/almond ) を使用できると思います。