NuxtでFullCalendarを使用したい

Question

Nuxtでアプリを作成し、FullCalendar v5を使用したいのですがうまく表示されません。
カレンダー自体は表示されているのですが、日にちがでてこないです。(カレンダーの上のヘッダーとカレンダーの枠だけはある形です。)

Calendar.vueコンポーネントは以下のようになっていて、pagesのindex.vueで読み込んでいます。どうすれば日付が出てくるでしょうか？

<template>
  <FullCalendar 
  :options='calendarOptions' 
  :header="calendarHeader"
  />
</template>

<script>
import FullCalendar from '@fullcalendar/vue'
import interactionPlugin from '@fullcalendar/interaction'
import timeGridPlugin from '@fullcalendar/timegrid'
import dayGridPlugin from '@fullcalendar/daygrid'

export default {
  components: {
    FullCalendar
  },
  data() {
    return {
      calendarOptions: {
        editable: false,
        navLinks: false,
        selectable: false,
        events: this.events,
        weekends: this.weekendsVisible,
        plugins: [dayGridPlugin, timeGridPlugin, interactionPlugin],
        initialView: "dayGridMonth",
      },
      calendarHeader: {
        left: 'prev,next today',
        center: 'title',
        right: 'dayGridMonth,timeGridWeek,timeGridDay,listWeek'
      },
    }
  }
}
</script>

Answer 1

cssでフォントカラーを白にしていたので見えてないだけでした。すみません