Question

我有一些基于jQuery的JavaScript库，我在其他项目中使用它，我想用我的ExtJS项目。其他项目通常通过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>

<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>

我想要依赖管理。

Answer 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.  
});

如何使用ExtJS动态加载和使用vanilla / jQuery库

1 个答案: