fullcalendar-angular: Full calendar does not work when is used in a lazy-loaded module
angular 15.0.2 fullcalendar 6.0.0-beta.3
I have tried to use full calendar in a module that is not lazy loaded - it works ok.
But when I use it in a module that is lazy loaded (via routing), then it bails an error:
Error: Providers from the `BrowserModule` have already been loaded. If you need access to common directives such as NgIf and NgFor, import the `CommonModule` instead.
This happens likely, because you are importing BrowserModule, which you should not do. You can import CommonModule.
About this issue
- Original URL
- State: closed
- Created 2 years ago
- Reactions: 14
- Comments: 17 (1 by maintainers)
Thanks for the report. This is now fixed in v6.0.0-beta.4
Please prio! 😃
Same here, just upgraded to Angular 14, with
6.0.0-beta3.Offending import: https://github.com/fullcalendar/fullcalendar-angular/blob/v6.0.0-beta.3/lib/src/full-calendar.module.ts#L14
Is there a specific reason why
BrowserModuleis imported?Works great now on v15, thanks for the quick fix and all your efforts.
Small workaround:
No lazy loading possible yet.
This is because
FullCalendarModuleis importingBrowserModulehttps://github.com/fullcalendar/fullcalendar-angular/blob/v6/lib/src/full-calendar.module.ts As I understand it,BrowserModuleshould never be imported inside a library and should only be imported in the root module of an applicationI suspect what should be imported inside
FullCalendarModuleisCommonModuleNo, downgrade does not solve the problem. 😦 Still got the same error message
This issue is preventing us from testing the v6 beta for event projection, as we use the module in two lazy loaded feature modules. I presume that the solution proposed by @Lightw3ight should work, a library should not import the BrowserModule.
I can test the content projection in a simpler project, but I can’t really justify keeping the workaround and preventing two large modules to be loaded upfront
You can downgrade to 6.0.0.beta2 with Angular 15 waiting there update fullcalendar
I don’t think there’s a quick workaround for using
6.0.0-beta3with Angular 14+ in a lazy-loaded Angular module - except from repackaging the lib in your own fork, but this isn’t what I would call ‘quick’, especially since the setup to build the package looks quite extensive.However, there exists a workaround for using version 5.x in Angular 14:
https://github.com/fullcalendar/fullcalendar-example-projects/tree/master/angular14#workarounds
It involves customizing Webpack to prevent the Angular build from trying to process Full Calendar’s CSS. We’ve put this in place in our project and the workaround works fine.