Hello DayPilot Team
I strictly followed your tutorial in order to display a simple calendar but it doesn’t work.
I use the latest version available on npm 4.3.0
<!-- src/components/CalendarCreche.vue -->
<script setup>
import { ref, onMounted } from "vue";
import { DayPilot, DayPilotCalendar } from "@daypilot/daypilot-lite-vue";
// Configuration du calendrier
const calendarConfig = ref({
viewType: "Week",
startDate: DayPilot.Date.today(),
headerDateFormat: "dddd d MMMM",
});
// Liste des événements
const events = ref([]);
onMounted(() => {
// Exemple d’événement
events.value = [
{
id: "1",
text: "Réunion équipe",
start: DayPilot.Date.today().addHours(10),
end: DayPilot.Date.today().addHours(12),
},
];
});
</script>
<template>
<div class="calendar-wrapper">
<DayPilotCalendar
:config="calendarConfig"
:events="events"
style="height: 500px; width: 100%"
/>
</div>
</template>
<style scoped>
.calendar-wrapper {
padding: 1rem;
background-color: #fff;
border-radius: 8px;
}
</style>
.
vue-router.mjs:2600 ReferenceError: require is not defined at daypilot-vue.min.js:20:12551 at daypilot-vue.min.js:20:12936
triggerError@vue-router.mjs:2600(anonyme)@vue-router.mjs:2381Promise.catchpushWithRedirect@vue-router.mjs:2372push@vue-router.mjs:2308navigate@vue-router.mjs:1536(anonyme)@runtime-dom.esm-bundler.js:750callWithErrorHandling@runtime-core.esm-bundler.js:197callWithAsyncErrorHandling@runtime-core.esm-bundler.js:204callWithAsyncErrorHandling@runtime-core.esm-bundler.js:215invoker@runtime-dom.esm-bundler.js:721