今、require.jsはJavaScriptをプログラムする私のお気に入りの方法です。コードを破壊し、管理しやすくします。 JS Optimizerは、より大きなアプリケーションを複数の小規模アプリケーションに配布し、依存関係を介して接続し、最後にコンピレーションとパッケージング中にマージするのに役立ちます。これらの理由は、require.jsを使用するように促します。
それでは、素晴らしい機能が必要なものを見てみましょう。
CommonJSと互換性があります
AMD（非同期モジュール定義仕様）は、CommonJSワークグループから表示されます。 CommonJSは、JavaScriptのエコシステムを作成することを目指しています。 CommonJSの重要な部分は、AMDの前身であるTransport/Cであり、JSはこの仕様の実装です。
CommonJSモジュールとAMDモジュールの構文の違いは、主にブラウザの非同期機能をサポートするAMDの必要性によるものです。たとえば、CommonJSモジュールを同期する必要があります。
コードコピーは次のとおりです。
var somemodule = require（ "somemodule"）;
var AnotherModule = require（ "AnotherModule"）;
exports.asplode = function（）{
somemodule.dotehawesome（）;
別のmodule.domoarawesome（）;
};
AMDモジュールはモジュールを非同期にロードするため、モジュール定義は最初のパラメーターとして配列を必要とし、モジュールのロード後のコールバック関数は2番目のパラメーターとして渡されます。
コードコピーは次のとおりです。
定義（["somemodule"]、function（somemodule）{
戻る {
Asprode：function（）{
somemodule.dotehawesome（）;
//これは非同期に実行されます
必要（["AnotherModule"]、function（anothermodule）{
別のmodule.domoarawesome（）;
}）;
}
};
}）;
ただし、AMDはrequire.jsのCommonJS構文とも互換性があります。 AMDの定義関数を介してCommonJSモジュールをラップすることにより、AMDにCommonJSモジュールを使用することもできます。
コードコピーは次のとおりです。
定義（関数（要求、エクスポート、モジュール）
var somemodule = require（ "somemodule"）;
var AnotherModule = require（ "AnotherModule"）;
somemodule.dotehawesome（）;
別のmodule.domoarawesome（）;
exports.asplode = function（）{
somemodule.dotehawesome（）;
別のmodule.domoarawesome（）;
};
}）;
実際、require.jsは、関数.toStringを介してコールバック関数のモジュールコンテンツを解釈し、正しい依存関係を見つけ、通常のAMDモジュールに変換します。この方法でモジュールを記述すると、AMD仕様に違反しているため、他のAMDローダーと互換性がない場合がありますが、この形式がどのように書かれているかを理解できることに注意してください。
ここで何が起こっているのか、必要です。JSは実際にfunction.toStringコールバック関数はモジュールの内容を解析し、通常のAMDモジュールの場合と同じように正しい依存関係を見つけます。このようなモジュールを作成することを選択した場合、これはAMD仕様に違反するため、他のAMDモジュールローダーと互換性がない可能性が高いことに注意することが重要ですが、この形式が存在することを理解することをお勧めします。
cdnバック
別の隠された要求。JSトレジャーは、CDNが誤ってロードされているときにローカルに対応するライブラリのロードロードをサポートすることです。 require.configを使用してこれを達成できます。
コードコピーは次のとおりです。
requirejs.config（{
パス：{
jQuery：[
'//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.0/jquery.min.js'、
「lib/jquery」
]
}
}）;
依存関係はありませんか？オブジェクトリテラル？問題ない！
依存関係がなく、いくつかの機能関数を含むオブジェクトを返すだけのモジュールを作成すると、単純な構文を使用できます。
コードコピーは次のとおりです。
定義する（{
forcechoke：function（）{
}、
forcelighting：function（）{
}、
forcerun：function（）{
}
}）;
モジュールが単なる関数のコレクションである場合、または単なるパケットである場合、これはシンプルで便利です。
円形依存関係
場合によっては、一部のアプリケーションに依存するモジュールモジュレアとモジュレアの関数が必要になる場合があります。これは循環依存関係です。
コードコピーは次のとおりです。
// js/app/modulea.js
定義（["require"、 "app/app"]、
関数（必要、app）{
戻る {
foo：function（title）{
var app = require（ "app/app"）;
app.somethingを返します（）;
}
}
}
）;
モジュールアドレスを取得します
モジュールのアドレスを取得する必要がある場合は、これを行うことができます...
コードコピーは次のとおりです。
var path = require.tourl（ "./ style.css"）;
baseurl
通常、ユニットテストを実施する場合、ソースコードはSRCに似たフォルダーに配置され、同時にテストをテストに似たフォルダーに配置できます。これは、テスト構成を正しくするのが難しい場合があります。
たとえば、テストフォルダーにindex.htmlファイルがあり、テスト/spec/*。jsをローカルにロードする必要があります。すべてのソースコードがSRC/JS/*。JSにあると仮定し、そのフォルダーにMain.JSがあります。
index.htmlでは、必要な場合はデータメインが設定されていません。JSがロードされています。
コードコピーは次のとおりです。
<スクリプトsrc = "src/js/vendor/require.js"> </script>
<スクリプト>
require（["../src/js/main.js"]、function（）{
require.config（{
baseurl： "../src/js/"
}）;
必要とする（[
「./spec/test.spec.js」、
「./spec/moar.spec.js」
]、 関数（） {
//テストフレームワークを開始します
}）;
}）;
</script>
main.jsがロードされていることがわかります。ただし、Data-Mainは設定されていないため、必要に応じてBaseURLを策定する必要があります。 Data-Mainを使用すると、BaseURLは設定されているファイルに従って自動的に設定されます。
ここでは、main.jsがロードされていることがわかります。ただし、データメインスクリプトタグをロードしないため、ベースを指定する必要があります。データが主にBaseURLに使用されている場合、メインファイルの場所から推測されます。 BaseURLをカスタマイズすることにより、テストコードとアプリケーションコードを個別に簡単に保存できます。
jsonp
このようなJSONP端末を処理できます。
コードコピーは次のとおりです。
必要とする（ [
「http://someapi.com/foo?callback=define」
]、function（data）{
console.log（data）;
}）;
非AMDライブラリの場合、Shimを使用して解決します
多くのリクエストの下で、AMD以外のライブラリを使用する必要があります。たとえば、バックボーンとアンダースコアは、AMD仕様に適応しません。そして、JQueryは実際にそれ自体をJQueryと呼ばれるグローバル変数として定義するだけなので、JQueryで何もする必要はありません。
幸いなことに、Shim構成を使用してこの問題を解決できます。
コードコピーは次のとおりです。
require.config（{
パス：{
「バックボーン」：「ベンダー/バックボーン」、
「アンダースコア」：「ベンダー/アンダースコア」
}、
シム：{
「バックボーン」：{
deps：["Underscore"]、
エクスポート：「バックボーン」
}、
「アンダースコア」：{
エクスポート：「_」
}
}
}）;