When using as ES6 module, events don't work

[lukas-frey]

Hello, whether I use events or eventSources, they do not appear in the calendar when using ES6 module configuration according to the documentation:

let ec = new Calendar({
                target: this.$el,
                props: {
                    plugins: [TimeGrid, DayGrid],
                    options: {
                        locale: 'cs',
                        firstDay: 1,
                        view: 'dayGridMonth',
                        events: [
                            {
                                start: '2024-05-03',
                                end: '2024-05-05',
                                title: 'event 1',
                                display: 'background',
                            },
                            {
                                start: '2024-05-02',
                                end: '2024-05-03',
                                title: 'event 2',
                            },
                        ]
                    },
                }
            });

Am I doing something wrong?

[vkurko]

I prepared a demo based on your code and the events are displayed fine:

[lukas-frey]

Hmm, not sure why it's not working then. I have it wrapped in an AlpineJS component, maybe that is causing issues. When I use ec.addEvent() it works though.

[vkurko]

Please provide a public demo so that I can reproduce the issue.

[vkurko]

@lukas-frey any update?

[lukas-frey]

Hi, no, when I created a plain JS project on stackblitz using an Alpine component, it worked.

I use it in a project with Laravel, Livewire, AlpineJS and FilamentPHP. There's a lot of places where it could have gone wrong, so the error is somewhere on my side probably. Thanks for your help though!