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库并在之后设置配置选项。

有没有一种更直接的方式来加载配置？

来源

2014-10-22 Subsurf

是的，不能用这个垫片。如果你的模块是一个真正的模块（调用'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

只是想让你知道我的最终解决方案。我放弃了使用包装脚本和地图配置。

的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'

可能看起来，它的工作就像一个魅力！

来源

2014-11-14 17:12:39 Subsurf

RequireJS：在加载库模块后自动加载配置脚本

回答

相关问题