如何在 Moodle 插件中包含 moment.js for Tempus Dominus Bootstrap 和 requirejs?
How to include moment.js for Tempus Dominus Bootstrap with requirejs in a Moodle plugin?
你好,我正在开发一个 Moodle 插件,我需要 Tempus Dominus 的 datetimepicker Bootstrap
我用的是 AMD requirejs。
在amd/src/我有config.js:
define([], function () {
window.requirejs.config({
paths: {
"moment": M.cfg.wwwroot + '/admin/tool/myplugin/js/moment.min',
"bootstrap": M.cfg.wwwroot + '/admin/tool/myplugin/js/bootstrap.bundle.min',
"datepicker": M.cfg.wwwroot + '/admin/tool/myplugin/js/bootstrap-datepicker141.min',
"datetimepicker": M.cfg.wwwroot + '/admin/tool/myplugin/js/tempusdominus-bootstrap-4.min',
},
shim: {
'moment': {exports: 'moment'},
'bootstrap': {exports: 'Bootstrap'},
'datepicker': { exports: 'datepicker'},
'datetimepicker': {deps: ['moment'], exports: '$.fn.datetimepicker'},
}
});
});
datetimepicker.js:
define(['tool_myplugin/config', 'datetimepicker'], function(unused,datetimepicker) {
return datetimepicker;
}
);
tool_myplugin.js:
define([
'jquery',
'tool_myplugin/moment',
'tool_myplugin/datepicker',
'tool_myplugin/datetimepicker',
],
function ($,moment) {
function initManage() {
$(document).ready(() => {
$('#datetimepicker1').datetimepicker({
format: 'HH:mm',
use24hours: true,
defaultDate: moment({hour: 9, minute: 00})
});
});
}
return {
init: function () {
initManage();
}
};
});
我在控制台中有这些错误:
Error: Tempus Dominus Bootstrap4's requires moment.js. Moment.js must be included before Tempus Dominus Bootstrap4's JavaScript. tempusdominus- bootstrap-4.min.js:20:9
.../tempusdominus-bootstrap-4.min.js:20:9
和
Error: No define call for datetimepicker
http://requirejs.org/docs/errors.html#nodefine
我找到了解决方案:
这里是amd/src/moment.js
define(['tool_myplugin/config', 'moment'], function(unused,moment) {
window.moment = moment;
if (!window.moment) {
alert("moment ko");
}
return moment;
}
);
你好,我正在开发一个 Moodle 插件,我需要 Tempus Dominus 的 datetimepicker Bootstrap
我用的是 AMD requirejs。
在amd/src/我有config.js:
define([], function () {
window.requirejs.config({
paths: {
"moment": M.cfg.wwwroot + '/admin/tool/myplugin/js/moment.min',
"bootstrap": M.cfg.wwwroot + '/admin/tool/myplugin/js/bootstrap.bundle.min',
"datepicker": M.cfg.wwwroot + '/admin/tool/myplugin/js/bootstrap-datepicker141.min',
"datetimepicker": M.cfg.wwwroot + '/admin/tool/myplugin/js/tempusdominus-bootstrap-4.min',
},
shim: {
'moment': {exports: 'moment'},
'bootstrap': {exports: 'Bootstrap'},
'datepicker': { exports: 'datepicker'},
'datetimepicker': {deps: ['moment'], exports: '$.fn.datetimepicker'},
}
});
});
datetimepicker.js:
define(['tool_myplugin/config', 'datetimepicker'], function(unused,datetimepicker) {
return datetimepicker;
}
);
tool_myplugin.js:
define([
'jquery',
'tool_myplugin/moment',
'tool_myplugin/datepicker',
'tool_myplugin/datetimepicker',
],
function ($,moment) {
function initManage() {
$(document).ready(() => {
$('#datetimepicker1').datetimepicker({
format: 'HH:mm',
use24hours: true,
defaultDate: moment({hour: 9, minute: 00})
});
});
}
return {
init: function () {
initManage();
}
};
});
我在控制台中有这些错误:
Error: Tempus Dominus Bootstrap4's requires moment.js. Moment.js must be included before Tempus Dominus Bootstrap4's JavaScript. tempusdominus- bootstrap-4.min.js:20:9
.../tempusdominus-bootstrap-4.min.js:20:9
和
Error: No define call for datetimepicker
http://requirejs.org/docs/errors.html#nodefine
我找到了解决方案:
这里是amd/src/moment.js
define(['tool_myplugin/config', 'moment'], function(unused,moment) {
window.moment = moment;
if (!window.moment) {
alert("moment ko");
}
return moment;
}
);