Javascript RequireJS管理大型模块

直到现在我才考虑使用RequireJS和AMD模块。 到目前为止，所有的事情都是通过几个全局变量和自调用函数来管理的

例如，有关我的模块的外观：

function HugeModule() {
    //usage = new HugeModule();  
};
HugeModule.prototype.functionX = function() {
    //Lets say - around 50 functions for HugeModule prototype
};

HugeModule.SubModule = function() {
    //usage = new HugeModule.SubModule();
    //And here could be multiple subModules like this
};
HugeModule.SubModule.prototype.functionX = function() {
    //Lets say - around 20 functions for HugeModule.SubModule prototype
};

现在我会这样写，我会把它分成至少4个文件：

//HugeModule.js
var HugeModule = (function() {
    function HugeModule() {
        //usage = new HugeModule();  
    };
    return HugeModule;
})();
//HugeModule.somePrototypeFunctions.js
(function() {
    HugeModule.prototype.functionX = function() {
        //Lets say - around 50 functions for HugeModule prototype
    };
})();
//HugeModule.SubModule.js
(function() {
    HugeModule.SubModule = function() {
        //usage = new HugeModule.SubModule();
        //And here could be multiple subModules like this
    };
})();
//HugeModule.SubModule.someOtherPrototypeFunctions.js
(function() {    
    HugeModule.SubModule.prototype.functionX = function() {
        //Lets say - around 20 functions for HugeModule.SubModule prototype
    };
})();

我真的很想用AMD模块和RequireJS来编写这些模块，我对它们应该如何编写有一个基本的想法，但我不确定-我该如何在多个模块之间划分它们

我可以这样写：

define([], function() {
    function HugeModule() {
        //usage = new HugeModule();  
    };
    HugeModule.prototype.functionX = function() {
        //Lets say - around 50 functions for HugeModule prototype
    };
    return HugeModule;
});

但是我想在多个文件之间分割它。我不希望使用连接文件的构建工具

我想要的是一个必需的模块——HugeModule，它将解析HugeModule.somePrototypeFunctions和HugeModule.SubModule的所有依赖项，这将解析HugeModule.SubModule.someOtherPrototypeFunctions的依赖项

---

我应该如何解决这个问题呢？

首先，有一个重要的警告：您试图做的事情并不适合ES6类的工作方式。如果您要编写ES6类或使用类似于ES6 TypeScript的类语法的语言编写，例如，有ES6+类型注释的类，那么您将不得不解决类语法问题或遇到转换问题。考虑将HugeModule重构为多个较小的类以避免这些问题。有关TypeScript上下文中的问题讨论，请参阅

如果不考虑上述警告，您可以通过如下方式组织代码来实现目标。我已经成功地使用这种模式很多年了

js只是结合了类的各个部分，并为其余代码提供了一个外观：

define(["./HugeModuleCore", "./HugeModuleA", "./HugeModuleB"], function (HugeModuleCore) {
    return HugeModuleCore;
});

HugeModuleCore.js创建类并在其上创建一些核心方法：

define([], function () {
    function HugeModule() {
    };

    HugeModule.prototype.someCoreFunction = function() {
    };

    return HugeModule;
});

HugeModuleA.js向核心添加了一些方法类别：

define(["./HugeModuleCore"], function (HugeModule) {
    HugeModule.prototype.someFunction = function() {
    };

    // You don't really need to return anything here.
});

define(["./HugeModuleCore"], function (HugeModule) {
    HugeModule.prototype.someOtherFunction = function() {
    };

    // You don't really need to return anything here.
});

HugeModuleB.js向核心添加了一些其他类别的方法：

define(["./HugeModuleCore"], function (HugeModule) {
    HugeModule.prototype.someFunction = function() {
    };

    // You don't really need to return anything here.
});

define(["./HugeModuleCore"], function (HugeModule) {
    HugeModule.prototype.someOtherFunction = function() {
    };

    // You don't really need to return anything here.
});