Requirejs -将多个文件合并为一个不依赖于Requirejs的js文件

requirejs - combine several files to single js file that not dependent on requirejs

本文关键字:Requirejs 文件 js 一个 依赖于 合并      更新时间:2023-09-26

我正在编写包含大量代码的jQuery插件。因此,我决定将代码分开,使其对我(开发人员)来说更加模块化。为此,我使用require.js。
现在我有6个js文件:

  1. utils.js
  2. base-row.jas
  3. a-row.js
  4. b-row.js
  5. my-table.js
  6. main.js

文件1到5定义了JavaScript的"类",它们之间有依赖关系。操作所有音乐会的"主"类是my-table.js。Main.js只依赖于my-table.js,并从中创建一个插件:

require([
    'my-table'
], function(MyTable) {
    jQuery.fn.myTable = function(options) {
        var table = new MyTable(this, options);
        this.data('myTable', table);
        return this;
    };
});

现在我想从这些文件创建一个大的js文件,其中包含所有的6个文件没有任何依赖(除了jQuery,用户应该把它引用)。为此,我使用了r.js (http://requirejs.org/docs/optimization.html),结果我得到了一个依赖于require.js的大js文件(并包含对定义和要求的调用)。我遵循这个:http://requirejs.org/docs/faq-optimization.html#wrap和使用杏仁.js为了结合我的所有文件的使用,不依赖于require.js。这很好。
问题是为什么我需要所有的定义和需要的方法调用和almond.js?为什么优化器不能只连接函数结果(正如这个问题所描述的:为什么连接的RequireJS AMD模块需要加载器?)像这样:

(function() {
    var utils = «function() {
        ....
        return Utils;
    }»();
    var baseRow = «function(A) {
        ....
        return BaseRow;
    }»(utils);
    ....
    ....
    var myTable = .....
    //<--This is require call and therefore doesn't return a thing
    (function(MyTable) {
        jQuery.fn.myTable = function(options) {
            var table = new MyTable(this, options);
            this.data('myTable', table);
            return this;
        };
    })(myTable);
})();

作为这个过程的结果,我决定检查出来,并手动将所有文件合并到一个缩小的文件。我最终得到的文件比杏仁版本小3k !
我没有找到r.js优化器背后的逻辑创建require.js依赖的结果。在我的例子中,没有人需要使用任何文件,我的主js文件是唯一的消费者。你觉得呢?

优化器中findNestedDependencies选项的默认值为"false",这意味着即使在脚本优化之后,仍然可能有一个嵌套的requiredefine调用需要模块加载器。外部依赖也需要加载器。

我同意,然而,如果findNestedDependencies被设置为"true",并且没有外部依赖是项目的一部分,优化器应该能够删除它对加载器的需求。

您可以只在文件中包含所需的文件。你可以通过调用getScript来实现。

$.getScript("my_lovely_script.js", function(){
   //whatever you want here.
});