wake-up-neo.com

'L' bezieht sich auf einen UMD-Kompilierungsfehler

Ich verwende in meinem Projekt das Plugin ngx-leaflet und angle-cli .

Ich versuche, die Broschüre wie im Dokument beschrieben zu verwenden, zum Beispiel:

 enter image description here

Das Problem ist, wenn ich versuche zu kompilieren, habe ich den folgenden Fehler erhalten:

 enter image description here

Zusammengestellt mit:

ng serve --aot

Kontext hier:

 enter image description here


Ich habe versucht, L auf verschiedene Weise zu importieren:

import { LeafletModule } from '@asymmetrik/ngx-leaflet';

Ich kann aber weder in der Dokumentation noch im github etwas finden.

Ich habe das Modul atm zum Kompilieren entfernt, aber ich brauche einen Workaround.

Hier ist der package.json, den ich benutze:

 enter image description here


Hier ist der Code in meiner Komponente, Benutzer von 'L':

@Component({
  selector: 'app-map-screens-element',
  templateUrl: './map-screens-element.component.html',
  styleUrls: [
    './map-screens-element.component.scss',
  ],
})

export class MapScreensComponent implements OnInit {
  /**
   * setting map options
   */
  public $mapOptions = {
    // we use the layer openstreetmap
    layers: [
      L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'),
    ],
    zoom: 15,
    center: L.latLng([48.866667, 2.333333]),
  };
}

Und hier der Import des Moduls in mein Projekt:

import { LeafletModule } from '@asymmetrik/ngx-leaflet';

@NgModule({
  imports: [
    LeafletModule,
  ],
  declarations: [
    // ...
  ],
  exports: [
    // ...
  ],
})

export class SharedElementModule { }
11
Grégory NEUT

Ihnen fehlt der Import von L über Ihrer Komponente. So wie:

import * as L from 'leaflet';
19
pgross

Nachdem ich angle-cli in ein neues leeres Projekt geklont habe, habe ich sockjs-client über NPM hinzugefügt. Dann habe ich versucht, eine SockJS-Instanz in einem NG-Service zu erstellen. SockJs ist nur ein Beispiel für ein nicht winkelkonformes npm-Paket:

import { SockJS } from 'sockjs-client';
//...
private socket: SockJs;
//...
this.socket = new SockJS(this.serverURI);

Dies kompilierte gut, hatte aber einen Laufzeitfehler

SockJS ist kein Konstruktor

Nach einigem Googeln stolperte ich über die Eingabe von Winkeln, um js-Typen für den TypeScript-Transpiler verfügbar zu machen https://www.typescriptlang.org/docs/handbook/tsconfig-json.html . Damit es funktioniert, musste ich Typen hinzufügen, indem @ types/sockjs-client von NPM installiert wurde. Das lieferte den Compiler-Fehler

'SockJS' bezieht sich auf eine globale UMD, aber die aktuelle Datei ist ein Modul . Fügen Sie stattdessen einen Import hinzu.

Dieser Fehler bedeutet, dass die Typen dem TypeScript-Transpiler bekannt sind, aber nicht explizit importiert werden. Sie müssen die Typen importieren, um TypeScript explizit mitzuteilen, dass Sie ein externes Skript verwenden, dessen Existenz während der Kompilierung nicht durch TypeScript überprüft werden kann. Das Vorhandensein dieses Pakets wird nur zur Laufzeit geprüft. Die explizite Importanweisung sieht folgendermaßen aus

import * as SockJsClient from 'sockjs-client';
//...
private socket: SockJsClient.Socket;
//...
this.socket = new SockJsClient(this.serverURI);
0
LordObi