requirejs 非 amd 脚本需要来自 amd 模块依赖的全局
requirejs non-amd script requires global from amd module dependency
我正在尝试在 RequireJS 中创建一个 shim 配置,归结为这个例子:
requirejs.config({
paths:{
'non-amd-script' : 'path-to/non-amd-script',
'amd-module' : 'path-to/amd-module'
},
shim: {
'non-amd-script' : { deps: ['amd-module'] }
}
});
这些脚本(至少是非 amd 模块之一)被 'designed' 包含在内,例如:
<script src="amd-module'></script>
<script src="non-amd-script'></script>
但我想使用 requireJS.
异步加载它们,使用依赖项等等
重要提示:
- (这就是我提出问题的原因)
non-amd-script
和
amd-module
是不可变的脚本(即它们被提供,
而且我无法修改它们的来源,因为更改会在更新时丢失
这些脚本)。
- 我用 PHP 生成我的 shim 配置(不要问...)但我不能 'smell' 这些边缘情况。
我想要的
如果页面需要,我会通过 require-call 启动 non-amd-script
的加载:
require(['non-amd-script'], function(loadedModule) { //do stuff if the module returns stuff });
问题
虽然这有效(amd-module
先加载,然后 non-amd-script
),但事实证明 non-amd-script
需要 return of amd-module
在全局变量。
有问题的 amd-module
是 Micromodal,如果在页内加载,它将注册到 window.MicroModal
,但由于它是模块感知的,它不会这样做当通过 requirejs.
加载时
它是模块感知的事实将使任何额外的垫片配置无效(如 exports
或 init
),因为这些将被 AMD 模块(AFAIK)忽略。
我试过的
我试过的一个 'solution' 是这样的:
shim: {
'non-amd-script' : {
deps: ['amd-module'],
init: function(MicroModal) { window.MicroModal = MicroModal; return this; }
}
}
但我真的觉得用这个不太舒服,因为如前所述,我用 PHP 生成我的 shim 配置,并且需要为其他脚本的 some/lots 执行此操作(可能相同问题)。
我的问题
如果 non-amd-script
没有注册 non-amd-script
中使用的任何全局变量,我怎样才能让 non-amd-script
与它所依赖的 amd-module
兼容?
谢谢!
您可以创建一个需要 amd-module
的代理模块并将其设为全局。我们可以称它为amd-module-proxy
。然后你可以在 shim 中使用它作为 non-amd-script
.
的依赖项
这是一个示例代码:
// amd-module-proxy.js
define(['amd-module'], function (MicroModal) {
window.MicroModal = MicroModal;
});
requirejs.config({
paths:{
'non-amd-script' : 'path-to/non-amd-script',
'amd-module' : 'path-to/amd-module',
'amd-module-proxy': 'path-to/amd-module-proxy'
},
shim: {
'non-amd-script' : { deps: ['amd-module-proxy'] }
}
});
我正在尝试在 RequireJS 中创建一个 shim 配置,归结为这个例子:
requirejs.config({
paths:{
'non-amd-script' : 'path-to/non-amd-script',
'amd-module' : 'path-to/amd-module'
},
shim: {
'non-amd-script' : { deps: ['amd-module'] }
}
});
这些脚本(至少是非 amd 模块之一)被 'designed' 包含在内,例如:
<script src="amd-module'></script>
<script src="non-amd-script'></script>
但我想使用 requireJS.
异步加载它们,使用依赖项等等重要提示:
- (这就是我提出问题的原因)
non-amd-script
和amd-module
是不可变的脚本(即它们被提供, 而且我无法修改它们的来源,因为更改会在更新时丢失 这些脚本)。 - 我用 PHP 生成我的 shim 配置(不要问...)但我不能 'smell' 这些边缘情况。
我想要的
如果页面需要,我会通过 require-call 启动 non-amd-script
的加载:
require(['non-amd-script'], function(loadedModule) { //do stuff if the module returns stuff });
问题
虽然这有效(amd-module
先加载,然后 non-amd-script
),但事实证明 non-amd-script
需要 return of amd-module
在全局变量。
有问题的 amd-module
是 Micromodal,如果在页内加载,它将注册到 window.MicroModal
,但由于它是模块感知的,它不会这样做当通过 requirejs.
它是模块感知的事实将使任何额外的垫片配置无效(如 exports
或 init
),因为这些将被 AMD 模块(AFAIK)忽略。
我试过的
我试过的一个 'solution' 是这样的:
shim: {
'non-amd-script' : {
deps: ['amd-module'],
init: function(MicroModal) { window.MicroModal = MicroModal; return this; }
}
}
但我真的觉得用这个不太舒服,因为如前所述,我用 PHP 生成我的 shim 配置,并且需要为其他脚本的 some/lots 执行此操作(可能相同问题)。
我的问题
如果 non-amd-script
没有注册 non-amd-script
中使用的任何全局变量,我怎样才能让 non-amd-script
与它所依赖的 amd-module
兼容?
谢谢!
您可以创建一个需要 amd-module
的代理模块并将其设为全局。我们可以称它为amd-module-proxy
。然后你可以在 shim 中使用它作为 non-amd-script
.
这是一个示例代码:
// amd-module-proxy.js
define(['amd-module'], function (MicroModal) {
window.MicroModal = MicroModal;
});
requirejs.config({
paths:{
'non-amd-script' : 'path-to/non-amd-script',
'amd-module' : 'path-to/amd-module',
'amd-module-proxy': 'path-to/amd-module-proxy'
},
shim: {
'non-amd-script' : { deps: ['amd-module-proxy'] }
}
});