すでにノックアウト JS を使用している既存の requireJS プロジェクトに、breezeJS を統合しています。私はいくつかの問題に遭遇しました。
<script>1 つ目は、読み込み済みの AMD 依存関係としてではなく、HTML ラッパーにタグとして含めない限り、そよ風が Q ライブラリを読み込むことができないことです。私のプロジェクトでは、コードを単一のスクリプト タグに抑えようとしているので、これは理想的ではありません。
2 つ目の問題は、breezeJS がノックアウトを読み込めないことです。main.js で、ノックアウトのパスを次のように定義しました。
knockout: '../libs/knockout/knockout-2.2.0',
(グローバルにアクセスしていないことを確実に知りたいので、これを行いますko)
しかし、プロジェクトにそよ風を追加したとき、そよ風はノックアウト ライブラリをロードできませんでした。そよ風のコードを見ると、ノックアウト ライブラリを としてロードするようにハードコーディングされていることがわかりますko。
すべてのコードを変更したくないので、AMD をロードしたノックアウト ライブラリを としてグローバル ウィンドウ オブジェクトに追加できることがわかりましたwindow['ko']。しかし、これはかなりのボッジのように感じます。また、奇妙なことに、この方法でQを追加して<script>タグを削除しても機能しませんでした。グローバルを汚染する前であっても、アプリケーションのライフサイクルの早い段階でQが必要だと思うためです-require()呼び出しをmain.jsにネストしましたが、ビルドプロセスからのアプリケーションファイルの大部分なので、そのアプローチを放棄しました。
プロジェクトに Q とノックアウトとそよ風を含めて、まだ 1 行の<script>タグを使用するにはどうすればよいですか<script>。
私は自分のプロジェクトでかなりの数の他のライブラリを使用していますが、統合がこれほど難しいライブラリはありません。
どんな助けでも大歓迎です
乾杯
ガブ
編集:これが私の完全な必須構成です:
require.config({
/**
* shims are for 3rd party libraries that have not been written in AMD format.
* shims define AMD modules definitions that get created at runtime.
*/
shim: {
'jqueryUI': { deps: ['jquery'] },
'jqueryAnimateEnhanced': { deps: ['jqueryUI'] },
'jqueryScrollTo': { deps: ['jquery'] },
'touchPunch': { deps: ['jquery'] },
//'Q': { exports: 'Q' },
//'breeze': { deps: ['Q', 'knockout'], exports: 'breeze' },
'path': { exports: 'Path' },
//'signalR': { deps: ['jquery'] },
},
paths: {
//jquery
jquery: '../libs/jquery/jquery-1.7.2.min',
'jquery.adapter': '../libs/jquery/jquery.adapter',
//jquery plugins
horizontalNav: '../libs/jquery/plugins/horizontalNav/jquery.horizontalNav',
jqueryUI: '../libs/jquery/plugins/jquery-ui/jquery-ui-1.9.2.custom',
jqueryAnimateEnhanced: '../libs/jquery/plugins/animate-enhanced/jquery.animate-enhanced',
touchPunch: '../libs/jquery/plugins/touch-punch/jquery.ui.touch-punch.min',
//jqueryScrollTo: '../libs/jquery/plugins/jquery-scrollTo/jquery.scrollTo.min',
//reveal: '../libs/jquery/plugins/reveal/jquery.reveal',
//opentip: '../libs/jquery/plugins/opentip/opentip-jquery',
//RequireJS
domReady: '../libs/require/plugins/domReady',
text: '../libs/require/plugins/text',
async: '../libs/require/plugins/async',
depend: '../libs/require/plugins/depend',
json: '../libs/require/plugins/json',
noext: '../libs/require/plugins/noext',
//coffee-script
'coffee-script': '../libs/coffee/coffee-script',
cs: '../libs/require/plugins/cs',
//Path
path: '../libs/path/path.min',
//Knockout
knockout: '../libs/knockout/knockout-2.2.0',
knockoutTemplateSource: '../libs/knockout/ko.templateSource',
knockoutValidation: '../libs/knockout/ko.validation',
//breeze
Q: '../libs/breeze/q',
breeze: '../libs/breeze/breeze.debug',
//Signals (Observer pattern)
signals: '../libs/signals/signals',
//SignalR - Push notifications
signalR: '../libs/signalR/jquery.signalR-0.5.2.min',
//utils
logger: 'common/logging/logger',
tinycolor: '../libs/tinycolor/tinycolor',
composing: 'common/composition/composing',
//app specific
BaseWidgetViewModel: 'app/view/core/BaseWidgetViewModel',
}
});