#BrowserAnimationsModule import in AppComponent Causes error

2 messages · Page 1 of 1 (latest)

solemn wyvern
#

I am trying to place BrowserAnimationsModule as in import in the standalone AppComponent in an angular16 application. The app fails to render in the browser with console errors.

import { Component } from '@angular/core'
import {
  BrowserAnimationsModule,
} from '@angular/platform-browser/animations'
import { RouterModule } from '@angular/router'


import { NxWelcomeComponent } from './nx-welcome.component'


@Component({
  standalone: true,
  imports: [
      NxWelcomeComponent, RouterModule,
      BrowserAnimationsModule
  ],
  selector: 'medsoft-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss'],
})
export class AppComponent {
  title = 'xomsoft';
}

Errors in console:


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.
    at new BrowserModule (platform-browser.mjs:1145:19)
    at Object.BrowserModule_Factory [as useFactory] (platform-browse

I am trying to find the BrowserModule to replace it with the BrowserAnimationsModule but cannot find the former. How can I get over this hurdle. It as a new app.

compact frost
#

Import BrowserAnimationModule from your root NgModule. If you don't have one because you're using bootstrapApplication, then add provideAnimations() to the providers in boostrapApplication().