1

ExtJS プロジェクトで使用したい他のプロジェクトで使用している jQuery ベースの JavaScript ライブラリがいくつかあります。他のプロジェクトでは、これらのライブラリを RequireJS を介して動的にロードするのが一般的です。

define(['lib/api/client', 'lib/my_lib'], function(ApiClient, MyLib) {
  ...
});

ExtJS プロジェクトでこれらのライブラリを使用したいとしましょう。ExtJS でこれを行う「標準的な」方法はありますか? この問題に対する一般的なアプローチは何ですか?

require([
  'lib/extjs/ext-all',
  'lib/api/client',
  'lib/my_lib'
], function(Ext, ApiClient, MyLib) {

  Ext.application({
    name: 'MyApp',
    appFolder: 'app',
    launch: function() {
      var apiClient = new ApiClient();

      Ext.create('MyApp.view.Main', {
        apiClient: apiClient
      });

      MyLib.doSomething();
    }
  });

});

と

require(['lib/extjs/ext-all'], function(Ext) {
  Ext.define('MyApp.view.Main', {
    ...
  });
});

結論: head 内に大量のスクリプト タグを含めることは避けたい:

<head>

<script src="lib/api/client" type="text/javascript"></script>
<script src="lib/my_lib" type="text/javascript"></script>
<script src="lib/my_other_lib" type="text/javascript"></script>
<script src="lib/another_lib" type="text/javascript"></script>
<script src="lib/and_another_lib" type="text/javascript"></script>
<script src="lib/and_yet_another_lib" type="text/javascript"></script>

</head>

そして、依存関係の管理が必要です。

4

1 に答える 1

1

Ext.Loader.loadScript メソッド ( api ) を使用できます。次のようにコードを整理できます。

Ext.Loader.loadScript('lib/api/client');
Ext.Loader.loadScript('lib/my_lib');

Ext.onReady(function () {
     // setup your Ext JS app here, external libraries are loaded.  
});
于 2013-07-17T06:27:37.630 に答える