angular: BrowserAnimationsModule not available via barrel / public api
I’m submitting a … (check one with “x”)
[x ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question
Current behavior
I’m using SystemJS and https://github.com/mgechev/angular-seed and I can’t import BrowserAnimationsModule.
Import: import { BrowserAnimationsModule } from '@angular/platform-browser/typings/animations';
Error:
VM686:2 GET http://localhost:5555/node_modules/@angular/platform-browser/typings/animations.js 404 (Not Found)
(anonymous) @ VM686:2
scheduleTask @ zone.js?1488980193959:1960
ZoneDelegate.scheduleTask @ zone.js?1488980193959:349
Zone.scheduleTask @ zone.js?1488980193959:192
Zone.scheduleMacroTask @ zone.js?1488980193959:206
(anonymous) @ zone.js?1488980193959:1984
send @ VM712:3
fetchTextFromURL @ system.src.js?1488980193958:1052
(anonymous) @ system.src.js?1488980193958:1788
ZoneAwarePromise @ zone.js?1488980193959:695
(anonymous) @ system.src.js?1488980193958:1787
(anonymous) @ system.src.js?1488980193958:2812
(anonymous) @ system.src.js?1488980193958:3390
(anonymous) @ system.src.js?1488980193958:3722
(anonymous) @ system.src.js?1488980193958:4114
(anonymous) @ system.src.js?1488980193958:4579
(anonymous) @ system.src.js?1488980193958:4848
(anonymous) @ system.src.js?1488980193958:408
ZoneDelegate.invoke @ zone.js?1488980193959:330
Zone.run @ zone.js?1488980193959:126
(anonymous) @ zone.js?1488980193959:679
ZoneDelegate.invokeTask @ zone.js?1488980193959:363
Zone.runTask @ zone.js?1488980193959:166
drainMicroTaskQueue @ zone.js?1488980193959:529
ZoneTask.invoke @ zone.js?1488980193959:420
(index):246 (SystemJS) XHR error (404 Not Found) loading http://localhost:5555/node_modules/@angular/platform-browser/typings/animations.js
Error: XHR error (404 Not Found) loading http://localhost:5555/node_modules/@angular/platform-browser/typings/animations.js
at XMLHttpRequest.wrapFn [as _onreadystatechange] (http://localhost:5555/node_modules/zone.js/dist/zone.js?1488980193959:1190:29) [<root>]
at Zone.runTask (http://localhost:5555/node_modules/zone.js/dist/zone.js?1488980193959:166:47) [<root> => <root>]
at XMLHttpRequest.ZoneTask.invoke (http://localhost:5555/node_modules/zone.js/dist/zone.js?1488980193959:416:38) [<root>]
Error loading http://localhost:5555/node_modules/@angular/platform-browser/typings/animations.js as "@angular/platform-browser/typings/animations" from http://localhost:5555/app/app.module.js Not expecting this error? Report it at https://github.com/mgechev/angular2-seed/issues
(anonymous) @ (index):246
ZoneDelegate.invoke @ zone.js?1488980193959:330
Zone.run @ zone.js?1488980193959:126
(anonymous) @ zone.js?1488980193959:679
ZoneDelegate.invokeTask @ zone.js?1488980193959:363
Zone.runTask @ zone.js?1488980193959:166
drainMicroTaskQueue @ zone.js?1488980193959:529
ZoneTask.invoke @ zone.js?1488980193959:420
Expected behavior
The import should be: import { BrowserAnimationsModule } from '@angular/platform-browser'
;
What is the motivation / use case for changing the behavior? Can’t use animations after upgrading to Angular 4 rc2
-
Angular version: 4.0.0-rc.2
-
Browser: Chrome
-
Language: TypeScript 2.1
About this issue
- Original URL
- State: closed
- Created 7 years ago
- Comments: 20 (5 by maintainers)
I added below to map and its working now:
I also have the below import in AppModule
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
Can you please also guide what settings are required for systemjs config file when using
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
Hi guys, did anyone get ng4 to work with lazy loading and animation? I loaded
BrowserAnimationsModule
in my app-modules.ts and animation works fine in main module, but not in lazy loaded modules, so I tried to loadBrowserAnimationsModule
in my shared module as I get an error of :Unhandled Promise rejection: BrowserModule has already been loaded. If you need access to common directives
any ideas? as I could not find anything on the web@yakhiramesh090 : you might getting this error if you would be importing module something like this
import { BrowserAnimationsModule } from ‘@angular/platform-browser/animations/animations’;
Make sure it is imported as
import { BrowserAnimationsModule } from ‘@angular/platform-browser/animations’;
Even after @naveedahmed1’s solution, I get a strange 404 on :
http://192.168.1.107/node_modules/@angular/platform-browser/bundles/platform-browser.umd.js/animations
This
/animations
afterumd.js
bothers me.Thx! Now the animations of angular material work. I had to add the following configuration to the project config:
We have two animations. One rotates an md-icon. This one works. The other one, which animates the size of a div, does not work after the upgrade.
Sorry, the import is
@angular/platform-browser/animations
See https://github.com/angular/angular/blob/master/CHANGELOG.md#installing-rc1