RequireJS - 即时加载模块

时间:2022-04-04 13:17:07

I am currently a beginner on RequireJS and i am a bit in trouble with the AMD concept, especially the way that RequireJS is defining it.

我目前是RequireJS的初学者,我对AMD概念有点麻烦,特别是RequireJS定义它的方式。

My aim is to build a smart Loader that call the specific Parser he needs.

我的目标是建立一个智能装载机,调用他需要的特定解析器。


To summarize my needs :

总结我的需求:

(A) I create my loader : new Loader(source)

(A)我创建我的装载机:新装载机(来源)

(B) source represents the data to load. That's a simple string.

(B)source表示要加载的数据。这是一个简单的字符串。

(C) A Loader object is created. It executes some algorithm to decide what is the best Parser to use. Eventually, it downloads the parser from a remote location. Finally, it loads the parser dynamically.

(C)创建Loader对象。它执行一些算法来决定使用什么是最好的Parser。最终,它从远程位置下载解析器。最后,它动态加载解析器。


My problem is this one : How can I load a module/plugin without expliciting it in the define? I cant set it in the define([theParserHere]) because I am unable to know which Parser is needed.

我的问题是这样的:如何加载模块/插件而不在定义中明确它?我无法在define([theParserHere])中设置它,因为我无法知道需要哪个Parser。

1 个解决方案

#1


2  

The require function sounds like it could be used for your purposes. It allows for loading of modules, but not defining a new module.

require函数听起来像是可以用于您的目的。它允许加载模块,但不能定义新模块。

Your loader could call a function such as the following to load a module dynamically when needed:

您的加载程序可以调用以下函数来在需要时动态加载模块:

function loadParser(name, fn) {
    require(["parsers/" + name], fn);
}

name would be the name of the parser or a path or something (note that my path was just an example) and fn is a callback to call when the loading has been completed. The first argument to the function would be the loaded module.

name将是解析器的名称或路径或其他内容(请注意,我的路径只是一个示例),fn是在加载完成时调用的回调。函数的第一个参数是加载的模块。

This function could be placed in your loader object or just sit inside the define:

这个函数可以放在你的loader对象中,或者只是放在define中:

define(function () {

    function Loader(text) {
        this.text = text;

        this.parser = null;
        this.loadParser();
    }

    Loader.prototype.loadParser = function () {
        var self = this;
        var parserName = this.getParserName();
        require(["parsers/" + parserName], function (Parser) {
            self.parser = Parser;
            self.parse();
        });
    }

    Loader.prototype.getParserName = function () {
        //mystery logic to determine language...
        return "some-parser-name";
    }

    Loader.prototype.parse = function () {
        if (!this.parser) {
            throw "No parser loaded";
        }
        //do your parsing logic...
    }

    return Loader;

});

Now, if I were actually doing this, I would use Q or jquery deferreds or something for resolving the parser inside the require callback function instead of all that function calling.

现在,如果我实际上是这样做的话,我会使用Q或jquery延迟或其他东西来解析require回调函数中的解析器而不是所有函数调用。

#1


2  

The require function sounds like it could be used for your purposes. It allows for loading of modules, but not defining a new module.

require函数听起来像是可以用于您的目的。它允许加载模块,但不能定义新模块。

Your loader could call a function such as the following to load a module dynamically when needed:

您的加载程序可以调用以下函数来在需要时动态加载模块:

function loadParser(name, fn) {
    require(["parsers/" + name], fn);
}

name would be the name of the parser or a path or something (note that my path was just an example) and fn is a callback to call when the loading has been completed. The first argument to the function would be the loaded module.

name将是解析器的名称或路径或其他内容(请注意,我的路径只是一个示例),fn是在加载完成时调用的回调。函数的第一个参数是加载的模块。

This function could be placed in your loader object or just sit inside the define:

这个函数可以放在你的loader对象中,或者只是放在define中:

define(function () {

    function Loader(text) {
        this.text = text;

        this.parser = null;
        this.loadParser();
    }

    Loader.prototype.loadParser = function () {
        var self = this;
        var parserName = this.getParserName();
        require(["parsers/" + parserName], function (Parser) {
            self.parser = Parser;
            self.parse();
        });
    }

    Loader.prototype.getParserName = function () {
        //mystery logic to determine language...
        return "some-parser-name";
    }

    Loader.prototype.parse = function () {
        if (!this.parser) {
            throw "No parser loaded";
        }
        //do your parsing logic...
    }

    return Loader;

});

Now, if I were actually doing this, I would use Q or jquery deferreds or something for resolving the parser inside the require callback function instead of all that function calling.

现在,如果我实际上是这样做的话,我会使用Q或jquery延迟或其他东西来解析require回调函数中的解析器而不是所有函数调用。