Angular-google-maps: Winkel 6-Unterstützung

Hier zu den Kommentaren

Hallo,

Ich habe gerade versucht, mein Projekt auszuführen, dies sind die zugehörigen Fehler:

node_modules/@agm/core/services/google-maps-api-wrapper.d.ts(2,10): error TS2305: Module '"my-project/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/@agm/core/services/managers/circle-manager.d.ts(2,10): error TS2305: Module '"my-project/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/@agm/core/services/managers/data-layer-manager.d.ts(2,10): error TS2305: Module '"my-project/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/@agm/core/services/managers/info-window-manager.d.ts(1,10): error TS2305: Module '"my-project/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/@agm/core/services/managers/kml-layer-manager.d.ts(2,10): error TS2305: Module '"my-project/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/@agm/core/services/managers/marker-manager.d.ts(2,10): error TS2305: Module '"my-project/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/@agm/core/services/managers/polygon-manager.d.ts(2,10): error TS2305: Module '"my-project/node_modules/rxjs/Observable"' has no exported member 'Observable'.
node_modules/@agm/core/services/managers/polyline-manager.d.ts(2,10): error TS2305: Module '"my-project/node_modules/rxjs/Observable"' has no exported member 'Observable'.

"@agm/core": "^1.0.0-beta.2",
"@angular/*": "6.0.0",
"rxjs": "^6.1.0",
"typescript": "2.7.2"

Ich habe meine Probleme über die Installation gelöst
npm install rxjs<strong i="6">@6</strong> rxjs-compat<strong i="7">@6</strong> --save

wie beschrieben https://github.com/ReactiveX/rxjs/blob/master/MIGRATION.md

Die AGM-Karten brechen mit RXJS 6 und benötigen das Compat-Modul für die Abwärtskompatibilität

Ich habe nach dem Angular 6-Upgrade immer noch ein Problem mit "snazzy-info-window".
core.js:1601 ERROR Error: Uncaught (in promise): TypeError: elems[0] is not a constructor TypeError: elems[0] is not a constructor at snazzy-info-window.js:130 at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:388) at Object.onInvoke (core.js:4071) at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:387) at Zone.push../node_modules/zone.js/dist/zone.js.Zone.run (zone.js:138) at zone.js:872 at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421) at Object.onInvokeTask (core.js:4062) at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420) at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188) at snazzy-info-window.js:130 at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:388) at Object.onInvoke (core.js:4071) at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:387) at Zone.push../node_modules/zone.js/dist/zone.js.Zone.run (zone.js:138) at zone.js:872 at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421) at Object.onInvokeTask (core.js:4062) at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420) at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188) at resolvePromise (zone.js:814) at resolvePromise (zone.js:771) at zone.js:873 at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421) at Object.onInvokeTask (core.js:4062) at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420) at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188) at drainMicroTaskQueue (zone.js:595)

Und ich bekomme auch diese Warnmeldung:
client?719c:153 ./node_modules/@agm/snazzy-info-window/directives/snazzy-info-window.js System.import() is deprecated and will be removed soon. Use import() instead. For more info visit https://webpack.js.org/guides/code-splitting/

Seien Sie vorsichtig mit der Verwendung des Pakets rxjs-compat , da es nur eine Problemumgehung ist und Ihrem Projekt viel Overhead hinzufügen wird. Jetzt ist es notwendig, da viele Pakete wie dieses noch nicht auf RxJS 6 aktualisiert wurden, aber es so schnell wie möglich entfernen.

@epenance hat gute Arbeit geleistet, indem er das Paket auf [email protected] aktualisiert hat, aber ich denke, bevor es vollständig Angular6-kompatibel wird, müssen Sie nach bahnbrechenden Änderungen suchen.

@ukon1990 der Winkel 6 wechselte zur Verwendung von Webpack 4, wodurch sich das Verhalten beim dynamischen Importieren von Commonjs-Modulen änderte. Ich weiß nicht warum, aber die snazzy-info-window-Direktive verwendet die dynamische Import-snazzy-info-window-Bibliothek, deshalb gibt es eine Warnung und eine kaputte snazzy-info-window-Direktive. Um es zu beheben https://github.com/SebastianM/angular-google-maps/blob/1a74b3a9670cf4dbf442033a17dea290dfadc408/packages/snazzy-info-window/directives/snazzy-info-window.ts#L228
sollte in this._nativeSnazzyInfoWindow = new elems[0].default(options); geändert werden, aber es ist keine Abwärtskompatibilitätslösung (es funktioniert nicht in angle5/webpack3). Ich weiß nicht, wie man es richtig repariert.

Ich bin mir ziemlich sicher, dass @SebastianM die Pakete nur um eine Hauptversion erweitern muss, da Angular 6 eine Menge Dinge in der Abwärtskompatibilität kaputt macht.

@Epenance ja, das muss ich wahrscheinlich tun, was ein bisschen nervig ist, weil ich zwei Zweige verwalten muss (weil bald zu wenig Leute auf v6 sein werden).

angle-google-maps funktioniert gut auf v6 mit rxjs-compat (außer @iget-master Bemerkung), aber die Direktive snazzy-info-window ist momentan wirklich kaputt. Vielleicht ist der einfachste Weg, den dynamischen Import in einen statischen zu ändern.

@SebastianM Sie können jetzt:

• Aktualisieren Sie das AGM-Paket auf RXJS6+RXJSCompat
• Lassen Sie uns den RXJSCompat fallen lassen

Alle sollen glücklich sein, nein?

@SebastianM über zwei Zweige, es gibt auch die ngx-translate Möglichkeit zum Upgrade, ein einziger Zweig, letzte Version nur mit v6 kompatibel, keine eckige Abwärtskompatibilität

Ich sage nicht, dass dies absolut der Fall ist, wollte nur darauf hinweisen, dass eine andere große Bibliothek (in Bezug auf monatliche Downloads) einen solchen Weg gewählt hat 😉

@jimmykane nein, da rxjs 6 nicht mit angle 4/5 kompatibel ist. Ich denke, ich habe eine Lösung ... PR kommt

@peterpeterparker Ich denke, es ist vernünftig, die neuesten beiden Versionen zu unterstützen, die jetzt eckig 5/6 sind, und ich habe einen abwärtskompatiblen Weg gefunden (das sollte vorerst sogar mit eckig 4 ​​funktionieren, aber ich werde die nächste Version mit Unterstützung für eckig 5 kennzeichnen / 6) - Aber gerne weiter diskutieren

@SebastianM überhaupt keine Sorge, wollte nur die Info bringen, ich bin auf jeden Fall zufrieden, da ich meine Website bereits auf v6 migriert habe 😉

IMO, da die Migration auf Angular 6 fast schmerzlos ist (zumindest bei unseren Projekten), sehe ich keinen Grund, eine Version für 4 und 5 beizubehalten. Stellen Sie einfach gefährliche Sicherheitsfixes bereit.

@SebastianM muss wirklich nativ aktualisiert werden

Werden wir eine stabile Version für die Unterstützung von Angular 6 haben? Funktioniert gut mit rxjs-compat, aber ich möchte es so schnell wie möglich entfernen

Hey..irgendein Update dazu?

Oh! Ich aktualisiere gerade auf Angular 6 und habe das Problem im Snazzy-Info-Fenster, das Sie diskutieren:

Fehler: Nicht erfasst (versprochen): TypeError: elems[0] ist kein Konstruktor
TypeError: elems[0] ist kein Konstruktor
bei snazzy-info-window.js:130

Hast du eine Idee, wie man das beheben kann?

Danke schön!

@manuelsanchezaponte vorerst funktioniert die @john-hi-Lösung, ändern Sie die Zeile 130 in _this._nativeSnazzyInfoWindow = new elems[0].default(options); in node_modules/@agm/snazzy-info-window/directives/snazzy-info-window.js . Dies ist eine vorübergehende Lösung, während das Paket Winkel 6 unterstützt.

@LordShiroe hat Recht, das scheint eine schnelle Lösung zu sein. AGM ist der letzte Blocker, der auf v6 aktualisiert.

Danke @SebastianM , danke für die schnelle Lösung! funktioniert wie ein Zauber. 🥇

Wow, du bist ein schneller Tester :D schön, dass es funktioniert 😅

@SebastianM vielen Dank 👍