Having an issue with initializing V5.3.2 FullCalendar in Salesforce Lightning Web Component:
JS:
import { loadStyle, loadScript } from 'lightning/platformResourceLoader';
import fullCalendar from '@salesforce/resourceUrl/fullCalendar532';
// import fullCalendar from '@salesforce/resourceUrl/fullCalendar442';
export default class FullCalendarTestV5 extends LightningElement
{
async renderedCallback()
{
console.log(`## loading up calendar library...`);
await Promise.all([
loadScript(this, fullCalendar + '/lib/main.js'),
loadStyle(this, fullCalendar + '/lib/main.css')
// loadScript(this, fullCalendar + '/packages/core/main.js'),
// loadStyle(this, fullCalendar + '/packages/core/main.css')
]).catch(error => {
console.error(`## error: ${error}`);
});
console.log(`## loaded up calendar library...`);
this.initialiseFullCalendarJs();
}
initialiseFullCalendarJs()
{
console.log(`## initializing calendar...`);
const ele = this.template.querySelector("div.fullcalendarjs");
console.log(`## ele: ${ele}`);
let calendar = new FullCalendar.Calendar(ele, {});
// calendar.render();
}
}```
HMTL:
```<template>
Full Calendar
<lightning-card>
<div id="calendar" class="fullcalendarjs slds-p-horizontal_small"></div>
</lightning-card>
</template>
Error:
fullCalendarTestV5.js:4 Uncaught (in promise) ReferenceError: FullCalendar is not defined at s.initialiseFullCalendarJs (fullCalendarTestV5.js:4) at s.renderedCallback (fullCalendarTestV5.js:4)