javascript - 如何使用 require JS 为数据表配置多个源？

Question

我正在尝试使用这个data table 。 但是需要多个 JS 资源，我不知道如何为 RequireJS 配置这两个资源？我尝试创建垫片，但表格未呈现。

以下是所需的两个文件:

 jquery.dataTables.min.js

 dataTables.bootstrap.min.js 

到目前为止，我使用以下配置部分工作和渲染:

require.config({

    paths: {
        jquery: 'https://code.jquery.com/jquery-1.11.3.min',
        dataTable: 'https://cdn.datatables.net/1.10.10/js/jquery.dataTables.min',

          // How do I create a shim for this?
        dataTableBootstrap: 'https://cdn.datatables.net/1.10.10/js/dataTables.bootstrap.min'

    }
});

在此处实例化:

require(["jquery", "dataTable"], function ($) {

    $(function () {

        $('#example').dataTable( {
            "pagingType": "simple_numbers",
            scrollY:        '50vh',
            scrollCollapse: true,
            "scrollX": true,
            "bPaginate": true,
            "bFilter": false,
            "bInfo": true
        } );

});

Answer 1

您不需要为其中任何一个进行填充。它们被识别为 requirejs 模块，并代替您管理自己的依赖项。他们都有universal module definition格式。他们都使用define()将自己创建为require模块并尝试获取他们的依赖关系。此依赖项已命名，它的名称是路径或在 paths requirejs 配置中定义的名称。

现在，我可以从这些库中找到它们所需的模块名称。

dataTable boostrap 需要 2 个依赖项["jquery","datatables.net"]。 jquery 在您的 paths 配置中定义良好，但找不到 datatables.net，因为您为它定义了不同的名称 dataTable。

这意味着您的 dataTable 路径需要更改为 datatables.net

datatables.net: 'https://cdn.datatables.net/1.10.10/js/jquery.dataTables.min',

这样，您需要定义/要求作为依赖项的是 jquery 和 dataTableBootstrap

define(["jquery", "dataTableBootstrap"], function ($) {
    // code here
}

这应该可以解决问题，但我没有测试它。

至于垫片。仅对于非 requirejs(非 AMD)依赖项才需要它，因为您需要自己指定它们的依赖项。 AMD 模块而是管理它们的依赖关系。