时间戳

首页 > 解决方案 > 在尝试导入插件 angular 之前出错 fullcalendar lib

javascript - 在尝试导入插件 angular 之前出错 fullcalendar lib

问题描述

我有这个错误：

Error: Please import the top-level fullcalendar lib before attempting to import a plugin.

当我将 resourceTimeGridPlugin 添加到插件时。

我的代码：

import dayGridPlugin from '@fullcalendar/daygrid';
import interactionPlugin, { Draggable } from '@fullcalendar/interaction';
import { FullCalendarComponent } from '@fullcalendar/angular';
import timeGridPlugin from '@fullcalendar/timegrid';
import resourceTimeGridPlugin from '@fullcalendar/resource-timegrid';

标签： javascriptangularwebpacktypesfullcalendar

解决方案

您必须在组件中包含 Calendar Core 对象：

import { Calendar } from '@fullcalendar/core';

在您的构造函数中，您必须添加以下内容：

 constructor() { 
    const name = Calendar.name; 
 }

完整示例：

import { Component } from '@angular/core';
import { Calendar } from '@fullcalendar/core';
import dayGridPlugin from '@fullcalendar/daygrid';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {

  calendarOptions = {
    plugins: [dayGridPlugin],
    initialView: 'dayGridMonth'
  };

 constructor() { 
    const name = Calendar.name;
  }
}

这会在插件需要之前强制加载/初始化核心组件和 VDom 引用。

推荐阅读