Я скачал полный пакет 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>