'listPlugin FullCalendar didn't work properly

I have this code :

....
import { FullCalendarComponent } from '@fullcalendar/angular';
import { EventInput } from '@fullcalendar/core';
import dayGridPlugin from '@fullcalendar/daygrid';
import interactionPlugin from '@fullcalendar/interaction';
import listPlugin from '@fullcalendar/list';
import timeGrigPlugin from '@fullcalendar/timegrid';
....
fullCalendarOptions = {
    allDaySlot: false,
    columnHeader: false,
    contentHeight: 'auto',
    defaultView: 'timeGridDay',
    header: {
        right: '',
        center: '',
        left: 'title'
    },
    height: 'auto',
    locale: this.translateService.currentLang,
    plugins: [dayGridPlugin, interactionPlugin, listPlugin, timeGrigPlugin],
    ....
}
....

I have the error : Please import the top-level fullcalendar lib before attempting to import a plugin. But ifI remove from plugin list : listPlugin all works just fine.

Have you an idea about that ? Thx in advance.



Solution 1:[1]

Check the version of @fullcalendar/list in your package.json. Does it match the versions of the other plugins you have installed?

I was facing this same issue just a couple hours ago, and I found that the versions were mismatched.

Solution 2:[2]

had similar problem. I updated @fullcalendar and all plugins and it solved my problem

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Anthony Salamanca
Solution 2 TheSabalaja