如何解决使用带有脚本标签的 fullcalendar/icalendar
对不起，如果这是一个非常基本的问题，但我想使用 fullcalendar 的 icalendar 包，使用脚本标签。
我看到 icalendar 不在 list of pre-built bundles 上，但我希望它仍然有可能。
我的问题是我不确定如何导入插件（这一行 plugins: [DayGridPlugin,iCalendarPlugin],）。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link
href="https://cdn.jsdelivr.net/npm/fullcalendar@5.5.1/main.min.css"
rel="stylesheet"
/>
<link href="./style.css" rel="stylesheet" />
<link href="./style.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/ical.js/0.0.3/ical.js"></script>
<script src="https://cdn.jsdelivr.net/npm/fullcalendar@5.5.1/main.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/fullcalendar@5.5.1/locales-all.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@fullcalendar/icalendar@5.5.1/main.global.min.js"></script>
<script>
document.addEventListener("DOMContentLoaded",function () {
var calendarEl = document.getElementById("calendar");
var today = new Date().toISOString().split("T")[0];
var calendar = new FullCalendar.Calendar(calendarEl,{
initialView: "dayGridMonth",initialDate: today,headerToolbar: {
left: "prev,next today",center: "title",right: "dayGridMonth,timeGridWeek,timeGridDay",},plugins: [DayGridPlugin,events: {
url: "https://www.gov.uk/bank-holidays/england-and-wales.ics",format: "ics",});
calendar.render();
});
</script>
</head>
<body>
<div id="calendar"></div>
</body>
</html>
对于上下文，我使用 sphinx 作为各种项目的静态站点生成器，所有这些项目都使用 GitHub 页面托管。我编写了一个 sphinx 扩展，它从静态站点中的降价 YAML 构建一个 .ics 文件，我希望使用类似于 this 站点的 fullcalendar 在站点页面上显示日历和即将发生的事件。
解决方法
终于搞定了。
- 首先，我必须将 .ics 文件拉入我的 Flask 后端，并从本地 URL 提供它以规避 CORS 政策。
- 然后我不得不使用并更新您拥有的 AJAX iCal 库版本。
此代码对我有用：
<div id='calendar' style="max-height: 80vh;"></div>
<link href="https://cdn.jsdelivr.net/npm/fullcalendar@5.5.1/main.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/ical.js/1.4.0/ical.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/fullcalendar@5.5.1/main.min.js"></script>
// <script src="https://cdn.jsdelivr.net/npm/fullcalendar@5.5.1/locales-all.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@fullcalendar/icalendar@5.5.1/main.global.min.js"></script>
<script>
document.addEventListener("DOMContentLoaded",function () {
var calendarEl = document.getElementById("calendar");
var calendar = new FullCalendar.Calendar(calendarEl,{
initialView: "dayGridMonth",headerToolbar: {
left: "prev,next today",center: "title",right: "dayGridMonth,timeGridWeek,timeGridDay",},// plugins: [DayGridPlugin,iCalendarPlugin],events: {
url: "/calendar/demo/ics_file",// url: "https://www.gov.uk/bank-holidays/england-and-wales.ics",format: "ics",});
calendar.render();
});
</script>
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。