CODEWITHSUNDEEP
primengangular19
Paris Sakkoulas
Paris Sakkoulas

Reputation: 1

Error on adding Prime NG button module to my Angular 19 project (An unhandled exception occurred: fn is not a function)

I am using Angular 19.0.0 and Prime NG 19.0.0, when I add button module on my imports array on my header standalone component I get this error : An unhandled exception occurred: fn is not a function See "C:\Users\GIANNI~1\AppData\Local\Temp\ng-AVgu2w\angular-errors.log" for further details.

Only if I remove ButtonModule from my component its working fine.

I try to import ButtonModule on my standalone component : imports: [ButtonModule],

This is my app.config.ts file where I set to use PrimeNG :

export const appConfig: ApplicationConfig = {
  providers: [
    provideZoneChangeDetection({ eventCoalescing: true }),
    provideRouter(routes),
    provideClientHydration(withEventReplay()),
    provideAnimationsAsync(),
    providePrimeNG({
      theme: {
        preset: Aura,
      },
    }),
  ],
};

And bellow is my header component where I want to use the button. And by just import it to header ts file I get the error : TypeError: fn is not a function

import { Component } from '@angular/core';
import { ButtonModule } from 'primeng/button';
@Component({
  selector: 'app-header',
  imports: [ButtonModule],
  templateUrl: './header.component.html',
  styleUrl: './header.component.css',
})
export class HeaderComponent {}

Upvotes: 0

Views: 44

Answers (1)

Paris Sakkoulas
Paris Sakkoulas

Reputation: 1

I did some research and found that the issue was likely due to version conflicts. To resolve it, I uninstalled Angular and reinstalled it globally. Now, everything is working fine.

Upvotes: 0

Related Questions