@Typen/googlemaps/index.d....ts' ist nicht ein Modul

Möchte ich verwenden die Google Maps API mit meinem Winkel-Projekt, und deshalb habe ich diese beiden Befehle zum installieren von npm Paketen:

npm install @agm/core --save-dev
npm install @types/googlemaps --save-dev

Fügte ich diese Zeile in meine Komponente:

import {} from "@types/googlemaps";

Aber ich sehe diese 2 Fehler in VS-Code:

[ts] File 'h:/Angular Projects/Breakfast/client/breakfast/node_modules/@types/googlemaps/index.d.ts' is not a module.
[ts] Cannot import type declaration files. Consider importing 'googlemaps' instead of '@types/googlemaps'.

Ich fügte diese Zeilen

"types": ["googlemaps"]
"moduleResolution": "node"

zu tsconfig.json und tsconfig.spec.json, aber noch kein Glück. Auf die Chrome Dev-Tools, sehe ich die folgende Fehlermeldung:

Error: Uncaught (in promise): TypeError: Cannot read property 'Autocomplete' of undefined
TypeError: Cannot read property 'Autocomplete' of undefined

Eckige version 6
Typoskript Version 2.9.2

Ich habe versucht, aus Eckig 5, zu.

Bitte wählen Sie eine der Antworten als korrekt.
Überprüfen Sie dieses Beispiel Winkel 7 Google maps freakyjolly.com/...
Danke @CodeSpy. Ihre FreakyJolly Beispiel arbeitete perfeclty.... mich gerettet Stunden ärger!

InformationsquelleAutor AMendis | 2018-06-28

97

Dank dieser Dokumentation link : https://www.typescriptlang.org/docs/handbook/triple-slash-directives.html

[Eckige 6+] Sie nur haben, fügen Sie diese Zeile am Anfang (Bedeutung der Linie 1, mit nichts vor) von Ihrem Transcript :
```
///<reference types="@types/googlemaps" />
```
[Eckigen 5-] Sie müssen nur fügen Sie diese Zeile an einer beliebigen Stelle in Ihrem Typoskript-Datei importiert :
```
import {} from "googlemaps";
```
Dank der Antwort unten, müssen Sie möglicherweise auch, um eine Datei hinzuzufügen <root>/index.d.ts mit (es war nicht erforderlich, obwohl in meinem Fall) :
```
declare module 'googlemaps';
```
- Wo soll ich diese Zeile einfügen ? in meiner Komponente ts-Datei ? - oder html-Datei ?
- was ist, wenn Sie versucht, die import {} von "googlemaps";
- Es ist nicht mehr funktioniert auf angular6+
- Gut.. die Frage ist angular6+ .. Aber ich bearbeitet habe, meine Antwort zu verdeutlichen, dass es
- Die triple slash funktioniert, aber WARUM nicht die normalen import-Anweisung funktionieren? Es ist diese Art von Scheiße, das macht einfach Kantig, schmerzhaft, mit zu arbeiten.
- Was? Warum hat das geklappt?! Was soll ' s? Umm... danke?
- Der Winkel 6+ option möglicherweise nicht eine gute Idee, TS-docs sagen: --- Verwenden Sie diese Anweisungen nur, wenn Sie die Erstellung eines d....ts-Datei von hand.--- Es ist also nicht verwendet werden soll, in ".ts" - Datei, nur "d....ts" Dateien.
- Für [Eckige 6+] es funktioniert nur mit dem hinzufügen am Beginn meiner Typoskript file: /// <Referenztypen="@types/googlemaps" /> (mit "@types/" Hinzugefügt).
- vielen Dank, beides klappt bei mir, komisch. Aber es macht mehr Sinn mit @types
- Dreifach-Schrägstrich-Richtlinie war für mich auf NG 6.1.1. Danke!
- gar nicht erst in Frage zu stellen. danke magic man
- Wo soll ich diese Zeile einfügen ? in meiner Komponente ts-Datei ? - oder html-Datei ?
- Nicht sicher, ich kann mehr explizit als das, was ich in meiner Antwort You only have to add this line at the beginning of your Typescript file
- Die Datei Cetia bezieht, wird jedem .ts-Datei, müssen Sie die Verwendung von googlemaps. Aber man muss hinzufügen, es auf den Anfang der Datei, vor dem Import in Zeile 1
InformationsquelleAutor Cétia
20

Kann der import vereinfacht wie folgt:
```
import {} from "googlemaps";
```
Fügen Sie eine Datei an Ihren Projekten root-Verzeichnis mit dem Namen index.d.ts und fügen Sie den folgenden:
```
declare module 'googlemaps';
```
- Habe gerade versucht dieser Ansatz, auf Vue.js) - Projekt und es hat funktioniert, beachten Sie für meinen Fall brauchte ich, um diesen hack unter die src/ Ordner eine Ebene nach unten aus tsconfig
- Dieser arbeitete für mich auf Winkel-6 - erforderlich, beides zu tun. Ich denke, das sollte die empfohlene Antwort.
InformationsquelleAutor Stephen Paul
8

Ich gerade erstellt einen index.d....ts in meinem src-Ordner und Hinzugefügt

erklären Modul 'googlemaps';

Es das Problem gelöst,

InformationsquelleAutor Cool Coder
6

Für mich, im Winkel 6, es funktioniert, wenn ich nur verwendet
```
///<reference types="@types/googlemaps" />
```
InformationsquelleAutor CamQuest

Funktioniert es einwandfrei

npm install --save-dev @types/googlemaps
At the beggining of your component file, type:
///<reference types="@types/googlemaps" />

InformationsquelleAutor Raghulraj Palanisamy

3

In meinem Winkel-6+ project habe ich das problem, erklärt die googlemaps-namespace oben in der typescript-Datei mit dieser Zeile:
```
///<reference path="../../../../../../node_modules/@types/googlemaps/index.d.ts"/>
```
mit dies getan, müssen Sie nicht importieren googlemaps auf andere Weise und dann funktioniert es. Verwenden Sie den korrekten Pfad zu Ihrem node_modules-Ordner.

Für weitere Informationen und Referenzen über das namespace-Verwendung im Typoskript hier die Dokumentation.
- Mit Eckigen 7.2, das war die Lösung für diejenigen, die auf dieser Seite aufgeführt, die erfolgreich für mich gearbeitet. Versuchen Sie die zusätzlichen index.d....ts' in ein types directory nicht erfolgreich war, noch war der Import {} etc.
InformationsquelleAutor bertonc96
0

In meinem Winkel 7+ Projekt

$ npm install @types/googlemaps --save-dev

In tsconfig.app.json
```
"types": [
      "googlemaps"
]
```
Danke den link unten
https://www.freakyjolly.com/angular-7-6-add-google-maps-in-angular-2-plus-applications-using-angular-google-maps-module-agm-core-easily/#more-2316

InformationsquelleAutor Anurak Boonyaritpanit

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.