@fullcalendar Error: Module parse failed: Unexpected token (4:0)

Estou usando o componente calendar do Prime NG, porém mesmo seguindo o passo a passo, está dando erros: Error: Module parse failed: Unexpected token (4:0) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders | /* classes attached to

.fc-not-allowed, | .fc-not-allowed .fc-event { /* override events' custom cursors */ | cursor: not-allowed;

E:

/node_modules/@fullcalendar/daygrid/main.css?ngGlobalStyle:2:0 - Error: Module parse failed: Unexpected token (2:0)

You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders |

:root { | --fc-daygrid-event-dot-width: 8px; | }

TS:

import { Component, OnInit } from '@angular/core'; import { CalendarOptions } from '@fullcalendar/angular';

@Component({ selector: 'app-calendar-screen', templateUrl: './calendar-screen.component.html', styleUrls: ['./calendar-screen.component.css'] })

export class CalendarScreenComponent implements OnInit{

events = []

calendarOptions !: CalendarOptions

constructor(){}

ngOnInit(){
  this.calendarOptions={
    initialView:'dayGridMonth',

  }
}

}

HTML:
<div class="my-container">
<p-fullCalendar [events]="events" [options]="calendarOptions"></p-fullCalendar>

module:

import {CUSTOM_ELEMENTS_SCHEMA, NgModule} from '@angular/core';

import { BrowserModule } from '@angular/platform-browser'; import {InputTextareaModule} from 'primeng/inputtextarea'; import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; import { LoginScreenComponent } from './login-screen/login-screen.component'; import { CalendarScreenComponent } from './calendar-screen/calendar-screen.component'; import { MainPageComponent } from './main-page/main-page.component'; import { NewsPageComponent } from './news-page/news-page.component'; import { InsertPageComponent } from './insert-page/insert-page.component'; import { LandingPageComponent } from './landing-page/landing-page.component';

import { CalendarModule } from 'primeng/calendar'; import { DiscussionForumComponent } from './discussion-forum/discussion-forum.component'; import {ButtonModule} from 'primeng/button'; import {FullCalendarModule} from '@fullcalendar/angular' import interactionPlugin from '@fullcalendar/interaction' import daygridPlugin from '@fullcalendar/daygrid'

FullCalendarModule.registerPlugins([ interactionPlugin, daygridPlugin ])

@NgModule({ schemas: [CUSTOM_ELEMENTS_SCHEMA], declarations: [ AppComponent, LoginScreenComponent, CalendarScreenComponent, MainPageComponent, NewsPageComponent, InsertPageComponent, LandingPageComponent, DiscussionForumComponent,

], imports: [ BrowserModule, AppRoutingModule, CalendarModule, InputTextareaModule, ButtonModule, FullCalendarModule,

], providers: [], bootstrap: [AppComponent] })

export class AppModule { }

Angular.json

"styles": [
          "src/styles.css",
          "./node_modules/@fullcalendar/common/main.css",
          "./node_modules/@fullcalendar/daygrid/main.css",
          "./node_modules/@fullcalendar/timegrid/main.css",
          "./node_modules/@fullcalendar/list/main.css",
          "node_modules/primeicons/primeicons.css",
          "node_modules/primeng/resources/themes/lara-light-blue/theme.css",
          "node_modules/primeng/resources/primeng.min.css"

        ],