当我加载页面时，日历不起作用，并且在我的控制台上，我有：
jQuery.Deferred exception: FullCalendar is not defined ReferenceError: FullCalendar is not defined
at HTMLDocument.<anonymous> (http://admin.test/agenda:279:20)
at mightThrow (http://admin.test/js/admin.js:30047:29)
at process (http://admin.test/js/admin.js:30115:12) undefined
admin.js:30340 Uncaught ReferenceError: FullCalendar is not defined
at HTMLDocument.<anonymous> (agenda:279)
at mightThrow (admin.js:30047)
at process (admin.js:30115)
1）我有一个带有“ AdminLTE 3.0.5”的laravel项目。
Package.json：
"devDependencies": {
"@fullcalendar/bootstrap": "^4.4.0",
"@fullcalendar/core": "^4.4.0",
"@fullcalendar/daygrid": "^4.4.0",
"@fullcalendar/interaction": "^4.4.0",
"@fullcalendar/timegrid": "^4.4.0",
"admin-lte": "^3.0.5",
"axios": "^0.19",
"bootstrap": "^4.4.1",
"jquery": "^3.4.1",
"jquery-ui": "^1.12.1",
"laravel-mix": "^5.0.1",
"lodash": "^4.17.13",
"popper.js": "^1.12",
"resolve-url-loader": "^2.3.1",
"sass": "^1.20.1",
"sass-loader": "^8.0.0",
"vue": "^2.5.17",
"vue-template-compiler": "^2.6.10"
},
2）我用webpack导入Fullcalendar软件包：
mix.js('resources/js/app.js', 'public/js/app.js')
.js('resources/js/calendar.js', 'public/js/calendar.js')
app.js：
require('./bootstrap');
window.Vue = require('vue');
Vue.component('example-component', require('./components/ExampleComponent.vue').default);
const app = new Vue({
el: '#app',
});
require('jquery-ui/ui/widgets/draggable');
require('admin-lte');
/* Table */
require('../../node_modules/admin-lte/plugins/datatables/jquery.dataTables.min.js');
require('../../node_modules/admin-lte/plugins/datatables-bs4/js/dataTables.bootstrap4.min.js');
require('../../node_modules/admin-lte/plugins/datatables-responsive/js/dataTables.responsive.min.js');
require('../../node_modules/admin-lte/plugins/datatables-responsive/js/responsive.bootstrap4.min.js');
require('../../node_modules/admin-lte/plugins/bs-custom-file-input/bs-custom-file-input.min.js');
calendar.js：
/* Calendar */
require('@fullcalendar/core');
require('@fullcalendar/daygrid');
require('@fullcalendar/timegrid');
require('@fullcalendar/interaction');
require('@fullcalendar/bootstrap');
3）在我的Vue上，我复制/粘贴AdminLTE3 calendar page，并且仅在以下位置添加我的2个混合文件：
<script src="{{ mix('js/app.js') }}"></script>
<script src="{{ mix('js/calendar.js') }}"></script>
<script>
$(function () {
/* initialize the external events
-----------------------------------------------------------------*/
function ini_events(ele) {
ele.each(function () {
[...]
我使用“ require（）”函数来调用所有js文件，并且当我运行“ npm run dev”时，一切正常，没有错误。我认为这是一个js文件顺序，但与AdminLTE3 calendar page的顺序相同...否则我是盲目的。我将日历包＆jquery＆jquery-ui的所有版本都更改为与该页面相同（dl版本为4.4.0）。
有人可以帮助我吗？