RequireJS:在加载库模块后自动加载配置脚本
问题描述:
我正在重构我们项目的JavaScript,以使用RequireJS按需加载所需的模块,而不是向HTML模板添加一堆脚本标记。RequireJS:在加载库模块后自动加载配置脚本
我们使用jQuery等几个库,用于jQuery的DataTables插件等,其中一些库在加载后需要一些初始化。 I. e。 DataTables的默认设置必须在lib被加载之后以及第一次使用之前设置。
目前,我在主要脚本中执行此操作,该脚本正在RequireJS后加载。这主要模块require
s表示需要初始化,像数据表的所有库,并设置默认设置
require(["jquery", "datatables"], function($) {
// Set datatables default values
$.extend(
$.fn.dataTable.defaults,
{
jQueryUI: true,
lengthMenu: [5, 10, 25, 50],
paginationType: "full_numbers",
pageLength: 5
}
);
});
这种做法是出于两个原因很烦人:
- 我宁愿有一个配置文件每个库,所以我不必在一个潜在巨大的主要脚本中改变设置
- 主脚本总是加载每个库来初始化其设置,即使在当前页面上可能不会使用某些库文件
为了改善这一点,我正在寻找某种“加载后”依赖性或回调,它会在加载库时自动加载或执行。
我想过对这些库使用shim配置的init回调,但由于我的库不会污染全局名称空间,只有依赖项被传递给init函数,所以我没有机会访问加载的init内的模块(据我所知)。
然后我想着修改RequireJS的地图配置来映射我。即DataTables转换为包装脚本,其中require
是实际的DataTables库并在之后设置配置选项。
有没有一种更直接的方式来加载配置?
答
只是想让你知道我的最终解决方案。我放弃了使用包装脚本和地图配置。
的RequireJs配置的相关部分:
// Configure the RequireJS library
var require = {
baseUrl: "js/modules",
paths: {
"jquery": "../lib/jquery/dist/jquery",
"datatables": "../lib/DataTables/media/js/jquery.dataTables",
},
map: {
// Map the 'datatables' library to its wrapper module
// for every other module that 'require's this library
'*': {
'datatables': 'application/datatables.wrapper'
},
// only the wrapper script is supposed to get the actual
// 'datatables' library when 'require'ing 'datatables'
'application/datatables.wrapper': {
'datatables': 'datatables'
},
}
};
我的包装脚本如下所示(文件 “JS /模块/应用/ datatables.wrapper.js”)
define(
// require jQuery, DataTables, and the DataTables configuration object
// which resides in another file
["jquery", "datatables", "application/config/datatables.config"],
function($, dataTable, config) {
// Set datatables default values
$.extend(
dataTable.defaults,
config
);
return dataTable;
}
);
由于奇如地图
'datatables': 'datatables'
可能看起来,它的工作就像一个魅力!
是的,不能用这个垫片。如果你的模块是一个真正的模块(调用'define'来定义它自己),那么你就不能使用它。 'map'是你最好的选择。这是我想到的第一件事。 – Louis 2014-10-22 11:07:10
这就是我在阅读手册后发现的,但我仍然希望有些RequireJS专家能够知道更清晰的解决方案。 – Subsurf 2014-10-22 11:14:48
对于一个通用的解决方案,使用'map'是我能想到的最清晰和最安全的解决方案。我也可以考虑一下解决方案,这个解决方案将涉及到将你正在使用的库“构建”到包含配置的新文件中,但这很糟糕(并且可能导致其他问题),并且(在我看来)它比使用map更隐晦。 – Louis 2014-10-22 11:20:06