私は RequireJS を使用しており、ページごとに独自のスクリプト ファイルを作成しています。ただし、一部のページ (サーバー側) に含まれるコンポーネントもいくつかあります。これらのページも独自のスクリプト ファイルを取得する必要がありますか、それとも必要な JavaScript を含むページに含める必要がありますか? 含まれているページの機能の一部は、多くのページに共通しています。
質問する
37 次
1 に答える
1
JavaScript をページ固有の機能ではなく、再利用可能なモジュールと考えたほうがよいと思います。たとえば、AJAX リクエストを開始する検索ボックス、いくつかの日付ピッカー、および多数のタブがページにあるとします。これらはそれぞれモジュールにする必要があります (または、それらが提供する機能が十分に複雑な場合は、いくつかのモジュール)。アプリを非常に焦点を絞った目的を持つ小さなピースに分割することで、各ビットを分離してテストし (自動化された単体テスト)、機能を別の場所で再利用することが容易になります。
JavaScript モジュールをロードする方法については、ユーザーのニーズに基づいて戦略的にロードすることが理にかなっているポイントがあります (例: core.js はデフォルトでロードされますが、search.js はユーザーが「検索」にアクセスするまでロードされません)。 " タブ) ですが、すべてを 1 つのファイルにパッケージ化し ( require の r.js ツールがこれを行います)、すべてのページで同じスクリプト ファイル (main.js) を使用するだけでかなりのことができます。
単一のスクリプト ファイルを使用する場合は、その機能のターゲットが存在しない場合でも js が機能する必要があることに注意してください。jQuery を使用すると、これが非常にシンプルになり、ほとんど考える必要がなくなります。たとえば、次のようになります。
$('#js-foo').on(...) // <-- this doesn't blow up if '#js-foo' isn't on the page.
また、ページの body タグに data-attr を設定する人も見てきました。
var page = $('body').data('page');
if (page === 'foo'){
component1.setup();
component2.setup();
}
あなたの場合、RequireJS / AMD スタイルのモジュールを使用して、すべてを 1 つのファイルにビルドしてみます。各コンポーネントは独自のモジュール ファイル (mycomponent.js) を取得し、main.js はすべてのモジュールを require() し、適切に初期化します。最後に、デプロイ時にすべてを 1 つのファイルにパッケージ化するように r.js ビルドを構成します。へ / 本番稼働中。
このトピックについてさらに詳しく知りたい場合は、次の投稿をご覧ください。
于 2012-11-28T17:53:40.467 に答える