web-dev-qa-db-ja.com

「L」はUMDグローバルを参照-コンパイルエラー

私のプロジェクトでは、プラグイン ngx-leaflet および angular-cli を使用しています。

私はドキュメントに記載されているようにリーフレットを使用しようとしています、例えば：

enter image description here

問題は、コンパイルしようとしたときに次のエラーが発生したことです。

enter image description here

でコンパイル：

ng serve --aot

ここのコンテキスト：

enter image description here

私はLをさまざまな方法でインポートしようとしました：

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

しかし、ドキュメントや github には何も見つかりません。

コンパイルするためにモジュールatmを削除しましたが、回避策が必要です。

ここに私が使うpackage.jsonがあります：

enter image description here

これが私のコンポーネント内のコードで、'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]),
  };
}

そしてここに私のプロジェクトへのモジュールのインポート：

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

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

export class SharedElementModule { }
angulartypescriptwebpackangular-clingx-leaflet
14
Grégory NEUT

コンポーネントの上にLのインポートがありません。そのようです：

import * as L from 'leaflet';
20
pgross

angular-cliを新しい空のプロジェクトに複製した後、追加したsockjs-client NPM経由。次に、NGサービスでSockJSインスタンスを作成しようとしました。 SockJsは、none angular準拠のnpmパッケージのサンプルです。

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

これは問題なくコンパイルされましたが、

SockJSはコンストラクタではありません

グーグルで検索した後、angularで入力を偶然見つけて、js-typesをTypeScriptトランスパイラーで使用できるようにしました https://www.typescriptlang.org/docs/handbook/tsconfig-json。 html 。これを機能させるには、NPMから@ types/sockjs-clientをインストールしてタイプを追加する必要がありました。これにより、コンパイラエラーが発生しました

「SockJS」はUMDグローバルを指しますが、現在のファイルはモジュールです。代わりにインポートを追加することを検討してください。

このエラーは、タイプがTypeScriptトランスパイラーに認識されているが、明示的にインポートされていないことを意味します。タイプをインポートして、コンパイル中にTypeScriptで存在を確認できない外部スクリプトを使用していることをTypeScriptに明示的に通知する必要があります。そのパッケージの存在は、実行時にのみチェックされます。明示的なインポート文は次のようになります

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