2015-11-16 2 views
2

Я скачал полный пакет DataTables со всеми его модулем, поскольку он не может получить доступ через URL CDN:DataTables + RequireJS: Не удается прочитать свойство «по умолчанию» неопределенного

https://www.datatables.net/download/ (все опции выбраны)

Я пытаюсь запустить его с помощью RequireJS, эта же система зависимостей используется в течение всего пакета DataTables, поэтому он не должен терпеть неудачу.

JSFiddle (отредактированная для целей JSFiddle): http://jsfiddle.net/42ucpwee/1/

Моих результатов конфигурации в этой ошибке:

datatables.js:93165 Uncaught TypeError: Cannot read property 'defaults' of undefined 

datatables.js: 93161-93171:

var DataTable = $.fn.dataTable; 


/* Set the defaults for DataTables initialisation */ 
$.extend(true, DataTable.defaults, { 
    dom: 
     "<'row'<'col-sm-6'l><'col-sm-6'f>>" + 
     "<'row'<'col-sm-12'tr>>" + 
     "<'row'<'col-sm-5'i><'col-sm-7'p>>", 
    renderer: 'bootstrap' 
}); 

Что может быть причиной этой ошибки, я что-то упустил или неправильно настроен?

script.js:

define(['jquery','datatables.net'], function($) { 
    $('#example').DataTable(); 
}); 

main.js:

requirejs.config({ 
    baseUrl: "lib", 
    paths: { 
     'jquery': '//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min', 
     'bootstrap': '//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min', 
     'datatables.net': 'DataTables/datatables', 
     'script': '../js/script' 
    }, 
    shim: { 
     'bootstrap': { 
      deps: ['jquery'] 
     }, 
     'jquery': { 
      exports: '$' 
     }, 
     'datatables.net': { 
      deps: ['bootstrap','jquery'] 
     }, 
     'script': { 
      deps: ['jquery','datatables.net'] 
     } 
    } 
}); 
requirejs(['script']); 

index.html:

<html> 
<head> 
    <link rel="stylesheet" href="https://cdn.datatables.net/s/bs-3.3.5/jszip-2.5.0,pdfmake-0.1.18,dt-1.10.10,af-2.1.0,b-1.1.0,b-colvis-1.1.0,b-flash-1.1.0,b-html5-1.1.0,b-print-1.1.0,cr-1.3.0,fc-3.2.0,fh-3.1.0,kt-2.1.0,r-2.0.0,rr-1.1.0,sc-1.4.0,se-1.1.0/datatables.min.css" type="text/css" /> 
    <script type="text/javascript" src="js/require.js"></script> 
    <script type="text/javascript" src="js/main.js"></script> 
</head> 
<body> 
    <table id="example" class="display" cellspacing="0" width="100%"> 
     <thead> 
      <tr> 
       <th>Name</th> 
       <th>Position</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
       <td>Tiger Nixon</td> 
       <td>System Architect</td> 
      </tr> 
     </tbody> 
    </table> 
</body> 
</html> 

ответ

0

Приемлемый ответ будет просто загрузить отдельные модули (вместо опции одного файла) и использовать следующий скрипт, он, кажется, вызывает меньше проблем, чем включение всех сразу:

http://jsfiddle.net/42ucpwee/2/

requirejs.config({ 
    appDir: ".", 
    baseUrl: "js", 
    paths: { 
     'jquery': '//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min', 
     'bootstrap': '//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min', 
     'datatables' : 'jquery.dataTables.min', 
     'datatables-bootstrap' : 'dataTables.bootstrap', 
    }, 
    shim : { 
     'jquery' : { 
      exports : 'jquery' 
     }, 
     'bootstrap' : { 
      deps : [ 'jquery' ], 
      exports : 'Bootstrap' 
     }, 
     'datatables' : [ 'jquery' ], 
     'datatables-bootstrap' : [ 'datatables' ], 
    } 
}); 
require([ 
    'jquery', 
    'datatables-bootstrap' 
], function ($) { 
    $('#example').DataTable(); 
});