不进行异步调用的CommonJS模块加载程序

CommonJS module loader that does not make async calls

本文关键字：CommonJS 模块 加载 程序 调用 异步      更新时间：2023-09-26

我正在开发一个移动网站（它不是一个单页应用程序），该网站的JS占用空间非常小（缩小和gzip小于10KB）。这里没有库或外部依赖项，所有的代码都是在内部编写的普通javascript。为了减少HTTP请求的数量，它在逻辑上被分离为几个文件，这些文件在分解之前被连接起来。文件中没有明确的名称空间。也就是说，它们看起来像：

// crossbrowser.js
function getScrollOffset() {
    // implementation
}
function ...

这不太理想，没有显式的依赖关系解析，作用域很容易从函数内部受到污染。没有进行任何处理来检查（lint或编译器）。作为第一步，我认为实现一个显式模块系统可以防止这种情况，并使代码变得更好。

根据我的理解，当在浏览器端使用模块时，他们都希望通过XHR加载CommonJS模块格式和RequireJS、Lab.js等加载程序。我不想那样，我想保留包含所有模块的单一脚本格式。我的文件看起来像：

var define = function () { /* ... */ };
var require = function () { /* ... */ };
define("crossbrowser", function (require, exports, module) {
    exports.getScrollOffset = function() {
        //
    };
    // etc.
});
define("foo", function (require, exports, module) {
    var crossbrowser = require('crossbrowser');
    exports.getNewOffset = function () {
        var offset = crossbrowser.getScrollOffset();
        // do something
        return offset;
    }
});
window.addEventListener('DOMContentLoaded', function () {
    // really dumb example, but I hope it gets the point across
    var crossbrowser = require('crossbrowser'),
        foo = require('foo');
    crossbrowser.scrollTo(foo.getNewOffset());
});

问题是，是否有任何加载程序以这种方式工作，或者我是否必须编写自己的define和require实现？

requirejs等加载程序的好处之一是，您可以在构建过程中使用优化器将所有模块组合成一个缩小的脚本，请参阅requirejs Optimizer

这将允许您在模块化结构中进行开发，但部署优化版本

看看webmake。

Webmake允许在浏览器中使用CommonJS模块。所有的js文件都合并到一个js文件中。装载机非常轻。Webmake也与CoffeeScript配合使用。

如果不需要异步加载，就不需要AMD加载程序。例如，如果使用r.js组合模块，并且必须在生产代码中加载整个RequireJS库。为什么不简单地使用编译器呢？只需看一下CommonJS编译器上的幻灯片http://www.slideshare.net/dsheiko/modular-javascript-with-commonjs-compiler这里是来源/文档http://dsheiko.github.io/cjsc/

相关文章：