Question

我创建了三个作为模块添加到YUI的小部件。所有小部件都使用Y.Get.js方法使用相同的javascript库（commons.js）。这些小部件在单独的js文件中定义（我需要这样做，以便这些小部件是独立的）。所有这些都被加载到HTML文件中并进行渲染。但是，通过在浏览器中检查HTML文件的元素，结果发现commons.js文件在HTML文件中包含三次，但具有不同的ID：

<script charset="utf-8" id="yui_3_5_0_1_1374466627361_24" src="js/common.js"></script>
<script charset="utf-8" id="yui_3_5_0_1_1374466627361_32" src="js/common.js"></script>
<script charset="utf-8" id="yui_3_5_0_1_1374466627361_38" src="js/common.js"></script>

YUI中是否有办法避免这种重复？谢谢！

Answer 1

如果您在模块的正文中使用模块，则在包含模块时将始终调用

Y.Get.js。

以下是一些建议：

将common.js的内容放入YUI模块。这可能是最好的选择
使用YUI加载并自动将其包装到模块中：

示例：

YUI({
  modules: {
    'my-common': {
      fullpath: 'js/common.js',
      requires: []
    }
  },
  onProgress: function (e) {
    for (var _module, i = 0, length = e.data.length; i < length; i++) {
      _module = e.data[i];
      if (_module.name === 'my-common') {
        YUI.add('my-common', function (Y) {
          Y.MyCommon = MyCommon;
        });
      }
    }
  }
}).use('my-common', function (Y) {
  // ...
});

使用YUI().use()

Y.Get.js

示例：

YUI(/* ... */).use('some-module', function (Y) {
  Y.Get.js('js/common.js', function () {
    // rest of your stuff
  });
});

在加载之前检查它是否已经加载

避免在YUI3中重复使用JavaScript

1 个答案: