Can't use npm packages with Livewire
Hi, guys. Maybe this is a stupid question but I don't know how to deal with it. So, I want to use FullCalendar, installed with npm, in a custom view but I got this error.
" module.esm.js:420 Uncaught TypeError: Cannot read properties of null (reading '__livewire')"
This is my code:
"<script>
import { Calendar } from '@fullcalendar/core'
import resourceTimelinePlugin from '@fullcalendar/resource-timeline'
const calendarEl = document.getElementById('calendar')
const calendar = new Calendar(calendarEl, {
plugins: [resourceTimelinePlugin],
initialView: 'resourceTimelineWeek',
resources: [
{ title: 'Resource A' },
{ title: 'Resource B' }
]
})
calendar.render()
</script>
<x-filament::page>
<div id='calendar'></div>
</x-filament::page>"
Sorry if my question is not in the right place
How can I use this calendar in a custom view? Thank you
2 Replies
Out of curiosity, why not use one of the existing filament calendar packages?
Also, you have to use a single root element in your livewire blades
Because I need this pro feature "Timeline View" and I was thinking I can't use with the existing package