JSPM Angular2-rc2 bauen Animationsfehler

So, mein angular2-Projekt mit JSPM für die Veröffentlichung: jspm bundle-sfx app dist/main.sfx.js. Alles klar, bis ich versuche, die gebaute App im Browser zu laden. Dies ist der Fehler erhalte ich: `JSPM Angular2-rc2 bauen Animationsfehler

EXCEPTION: Error during instantiation of AnimationDriver! (ViewUtils -> RootRenderer -> DomRootRenderer -> AnimationDriver 

ORIGINAL EXCEPTION: TypeError: Cannot read property 'animate' of null

Vollprotokoll ist wie folgt:

The key "target-densitydpi" is not supported. 
EXCEPTION: Error during instantiation of AnimationDriver! (ViewUtils -> RootRenderer -> DomRootRenderer -> AnimationDriver). 
EXCEPTION: Error during instantiation of AnimationDriver! (ViewUtils -> RootRenderer -> DomRootRenderer -> AnimationDriver). 
ORIGINAL EXCEPTION: TypeError: Cannot read property 'animate' of null 
ORIGINAL STACKTRACE: 
TypeError: Cannot read property 'animate' of null 
    at BrowserDomAdapter.supportsWebAnimation (browser_adapter.js:507) 
    at _resolveDefaultAnimationDriver (browser.js:95) 
    at ReflectiveInjector_._instantiate (reflective_injector.js:468) 
    at ReflectiveInjector_._instantiateProvider (reflective_injector.js:410) 
    at ReflectiveInjector_._new (reflective_injector.js:399) 
    at ReflectiveInjectorDynamicStrategy.getObjByKeyId (reflective_injector.js:275) 
    at ReflectiveInjector_._getByKeyDefault (reflective_injector.js:571) 
    at ReflectiveInjector_._getByKey (reflective_injector.js:548) 
    at ReflectiveInjector_._getByReflectiveDependency (reflective_injector.js:539) 
    at ReflectiveInjector_._instantiate (reflective_injector.js:441) 
EXCEPTION: Error during instantiation of AnimationDriver! (ViewUtils -> RootRenderer -> DomRootRenderer -> AnimationDriver). 
EXCEPTION: Error during instantiation of AnimationDriver! (ViewUtils -> RootRenderer -> DomRootRenderer -> AnimationDriver). 
ORIGINAL EXCEPTION: TypeError: Cannot read property 'animate' of null 
ORIGINAL STACKTRACE: 
TypeError: Cannot read property 'animate' of null 
    at BrowserDomAdapter.supportsWebAnimation (browser_adapter.js:507) 
    at _resolveDefaultAnimationDriver (browser.js:95) 
    at ReflectiveInjector_._instantiate (reflective_injector.js:468) 
    at ReflectiveInjector_._instantiateProvider (reflective_injector.js:410) 
    at ReflectiveInjector_._new (reflective_injector.js:399) 
    at ReflectiveInjectorDynamicStrategy.getObjByKeyId (reflective_injector.js:275) 
    at ReflectiveInjector_._getByKeyDefault (reflective_injector.js:571) 
    at ReflectiveInjector_._getByKey (reflective_injector.js:548) 
    at ReflectiveInjector_._getByReflectiveDependency (reflective_injector.js:539) 
    at ReflectiveInjector_._instantiate (reflective_injector.js:441) 
InstantiationError {_wrapperMessage: "DI Exception", _originalException: TypeError: Cannot read property 'animate' of null 
    at BrowserDomAdapter.supportsWebAnimation (htt…, _originalStack: "TypeError: Cannot read property 'animate' of null↵… (https://randohinn.com/w2w/main.sfx.js:47702:34)", _context: null, _wrapperStack: "Error: DI Exception↵ at InstantiationError.Wrap… (https://randohinn.com/w2w/main.sfx.js:47702:34)"…}

Was einen solchen Fehler verursachen könnte?

Quelle

2016-06-21 Rando Hinn

Ich hatte den gleichen Fehler, wenn ich angular2 App mit Webpack gebündelt habe. Es stellte sich heraus, dass es sich in meinem Fall beschwerte, dass document.bodynull ist. Dies passiert, wenn Sie Ihre Skripte in head vor body Abschnitt und Skript sofort versuchen, mit document.body zu arbeiten.

Meine index.html war so:

<!DOCTYPE html> 
<html> 
<head> 
    <base href=""> 

    <title>Legal Review</title> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 

    <script src="build/thirdparty.js"></script> 
    <script src="build/app.js"></script> 
</head> 

<body> 
    <app-component> 
     Loading... 
    </app-component> 
</body> 

</html>

Also, ich bin umgezogen Skripte wie folgt aus:

<!DOCTYPE html> 
<html> 
<head> 
    <base href=""> 

    <title>Legal Review</title> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
</head> 

<body> 
    <app-component> 
     Loading... 
    </app-component> 

    <script src="build/thirdparty.js"></script> 
    <script src="build/app.js"></script> 
</body> 

</html>

Und jetzt funktioniert es gut.

Quelle

2016-06-21 13:20:07 megaboich

Danke. Dies funktionierte für mich mit JSPM Bundle-SFX. Dort war die Fehlermeldung ziemlich kryptisch und ich habe meinen Skript-Tag-Standort auf dem Angular2-Dokument-Schnellstart-Beispiel basiert ... –

vielen Dank, ich konnte nicht verstehen, warum dieser Fehler zufällig aussah! – Gnujeremie

JSPM Angular2-rc2 bauen Animationsfehler

Antwort

Verwandte Themen