javascript 使用 Require.js 动态加载模块
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21379023/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Load modules dynamically with Require.js
提问by martasd
I am trying to load modules dynamically as described at the beginning of this post:
我正在尝试按照本文开头所述动态加载模块：
Here is my scripts/main.js
这是我的 scripts/main.js
require.config({
baseUrl: 'scripts',
paths: {
jquery: 'lib/jquery-2.0.3'
},
config: {
'main': {
modules: ['mod1', 'mod2', 'mod3']
}
}
});
require(function(require, exports, module) {
console.log("Loading modules");
require(module.config().modules);
});
When main.js gets loaded, code inside the outer require function never gets executed and "Loading modules" never gets printed to the console. Having read the AMD documentation at This link, I can't see what I am doing wrong. What is the proper way of dynamically loading modules defined externally in an array?
当 main.js 被加载时，外部 require 函数中的代码永远不会被执行并且“加载模块”永远不会被打印到控制台。在此链接上阅读了 AMD 文档后，我看不出我做错了什么。在数组中动态加载外部定义的模块的正确方法是什么？
Thanks!
谢谢！
UPDATE:
更新：
Here is what I have now:
这是我现在所拥有的：
// main.js
require.config({
...
config: {
'some_module': {
modules: ['mod1']
}
}
});
require(['some_module'], function(some_module) {
});
// some_module.js
define(function(require, exports, module) {
var mods = module.config().modules;
var mod;
for (var i=0; i < mods.length; i++) {
mod = require(mods[i]);
mod.fn_call();
}
});
When I execute require(module.config().modules), mod1indeed gets loaded. I am not sure how to use the return value of require to call a function returned by mod1, however.
当我执行时require(module.config().modules)，mod1确实被加载了。但是，我不确定如何使用 require 的返回值来调用 mod1 返回的函数。
With the code above, I get
使用上面的代码，我得到
Uncaught Error: Module name "mod1" has not been loaded yet for context: _
http://requirejs.org/docs/errors.html#notloaded
How can I access the functions from the modules I am loading?
如何从我正在加载的模块访问功能？
回答by Andrei Tomashpolskiy
You should use the defineinstruction:
您应该使用定义指令：
define(function(require, exports, module) {
console.log("Loading modules");
require(module.config().modules);
});
By configproperty of RequireJS configuration you define configurations for each of your modules. Then, in module definition you may access that config, in your case to load dependencies.
通过RequireJS 配置的config属性，您可以为每个模块定义配置。然后，在模块定义中，您可以访问该配置，在您的情况下加载依赖项。
In any case, I don't think you need to expose your application's main entry point as an AMD module, because it makes no sense. It should be like this:
无论如何，我认为您不需要将应用程序的主入口点公开为 AMD 模块，因为这毫无意义。应该是这样的：
// some_module.js (or path for some_module alias)
define(function(require, exports, module) {
require(module.config().modules);
...
return function () {};
});
// main.js
require.config({
...
config: {
'some_module': {
modules: ['mod1', 'mod2', 'mod3']
}
}
});
require('some_module'); // loads some_module, mod1, mod2, mod3
回答by Rodrigo Fonseca
Why are you loading your modules in this way? You're trying to make a async call inside a loop, basically you are rewriting your "mod" variable every time with another require even without the async call of require return something.
为什么要以这种方式加载模块？您正在尝试在循环内进行异步调用，基本上您每次都使用另一个 require 重写“mod”变量，即使没有 require 的异步调用返回某些内容。
// some_module.js
define(function(require, exports, module) {
var mods = module.config().modules;
var mod;
for (var i=0; i < mods.length; i++) {
mod = require(mods[i]);//your loop doesn't will wait for it...
mod.fn_call();
}
});
Load your modules in this way and if you want to put some dependencies, you do that with config(http://requirejs.org/docs/api.html#config), i don't see any reasons to not do this...
以这种方式加载你的模块，如果你想放置一些依赖项，你可以使用 config( http://requirejs.org/docs/api.html#config) 来做，我看不出有任何理由不这样做。 ..
define(['mod1', 'mod2', 'mod3'], function(mod1, mod2, mod3) {
//do whatever you want with your modules
});
