Visual Studio Code - Passen Sie die Einstellung für das Importangebot an

Wenn Sie in Visual Studio Code in TypeScript arbeiten, generiert der Importvorschlag für einen Typ (ausgelöst durch Leerzeichen + Punkt) einen Import in doppelten Anführungszeichen.

Unser TypeScript-Linter überprüft, ob nach Möglichkeit einfache Anführungszeichen verwendet werden.

Wie Sie unten sehen können, enthält der Vorschlag doppelte Anführungszeichen ("@angular / ...").

Wie kann ich die Einstellung des Imports anpassen?

Ab VSCode 1.10 ist dies (leider) noch nicht möglich. Aber es ist ein Problem für einen Großteil der Benutzer, wie es scheint. Das VSCode-Design kennt dieses Problem, und Sie können es befolgen, um zu erfahren, wann es implementiert wird: https://github.com/Microsoft/TypeScript/issues/13270

Update Juni 2018

Seit VSCode 1.24 (Juni 2018) gibt es dafür eine Option!

"typescript.preferences.quoteStyle": "single"

Weitere Informationen finden Sie unter:

https://code.visualstudio.com/updates/v1_24#_preferences-for-auto-imports-and-generated-code

Sie können auch die folgende Zeile in Ihren vscode-Benutzereinstellungen konfigurieren, um diese Einstellung anzupassen.

"prettier.singleQuote": true

Ich habe das mit der Editor-Konfiguration behoben. Öffnen Sie Ihre .editorconfig- Datei in Ihrem Projektstammverzeichnis (falls nicht, erstellen Sie diese Datei) und fügen Sie diese Zeile nach dem [*] hinzu.

[*]
...
quote_type = single

Im Wiki sehen Sie die vollständige Liste der Eigenschaften.

Ab VS Code 1.21.1 müssen Sie bearbeiten

/usr/share/code/resources/app/extensions/typescript-basics/snippets/typescript.json

In Windows

/ Applications / Visual Studio Code.app/Contents/Resources/app/extensions/typescript-basics/snippets/typescript.json .

In Windows 10 (vscode Version 1.30. * (Benutzer-Setup) später)

* C: \ Benutzer \ <IhrBenutzername> \ AppData \ Local \ Programme \ Microsoft VS-Code \ Ressourcen \ App \ Erweiterungen \ Typoskript-Grundlagen \ Snippets \ Typoskript.json

Stellen Sie im Abschnitt 'Externes Modul importieren' dieser Datei die Eigenschaft body array auf den Wert ein. "import { $0 } from '${1:module}';"Der Abschnitt sieht dann folgendermaßen aus:

"Import external module.": {
    "prefix": "import statement",
    "body": [
        "import { $0 } from '${1:module}';"
    ],
    "description": "Import external module."
},

Eine Alternative, die diese Konfiguration unterstützt, ist TypeScript Toolbox .

Es kann durch Einstellung konfiguriert werden genGetSet.pathStringDelimiter, bei der der Import in einfache Anführungszeichen bereits standardmäßig verwendet wird.

Gehen Sie zu "Datei> Einstellungen> Einstellungen" und fügen Sie diese unter Benutzereinstellungen hinzu:

"typescript.preferences.quoteStyle": "single",
"javascript.preferences.quoteStyle": "single"

Ab TypeScript 2.5 wird die erste Import- oder Exportanweisung in der Datei gescannt, um festzustellen, ob bei der Verwendung von Importvorschlägen einfache oder doppelte Anführungszeichen verwendet werden.

https://github.com/Microsoft/TypeScript/pull/17750

Sie können die folgende Zeile auch in Ihren vscode-Benutzereinstellungen konfigurieren, um ein einfaches Anführungszeichen in einer Zeichenfolge zuzulassen.

Gehen Sie zu Einstellungen> Benutzereinstellungen

"prettier.singleQuote": true

Dies ermöglicht ein einfaches Anführungszeichen in String. Wenn Sie andernfalls alle doppelten Anführungszeichen manuell in einfache Anführungszeichen ändern, werden diese beim Speichern zurückgesetzt. Fügen Sie außerdem hinzu

"tslint.autoFixOnSave": true

beim Speichern automatisch reparieren.

Dies ist bereits implementiert (wie in einer anderen Antwort erwähnt)! Aber Sie sind wahrscheinlich noch nicht auf der neuesten Version von TypeScript.

Die Lösung ist einfach:

Klicken Sie zwischen "TypeScript" und einem kleinen Smiley in der unteren rechten Ecke auf die TypeScript-Versionsnummer (z. B. 2.3.4). Wechseln Sie dann zur integrierten Version von Visual Studio Code (derzeit 2.5.3).

Danach leitet der Visual Studio-Code den Importzitatstil ab, indem er sich die erste Importanweisung ansieht . Beachten Sie, dass ein kleines Popup-Label ohnehin immer noch doppelte Anführungszeichen anzeigt.

Fehlerbericht

Relevante Pull-Anfrage :

Dies bietet die Möglichkeit zu bestimmen, ob einfache oder doppelte Anführungszeichen für neue Importe verwendet werden sollen, die über Codekorrekturen hinzugefügt wurden. Wenn ein neuer Import hinzugefügt wird, durchsuchen wir die obersten Anweisungen der Quelldatei nach vorhandenen Import- oder Exportdeklarationen mit Modulspezifizierern. Wir verwenden dann den Anführungszeichenstil des ersten, den wir finden. Wenn die Datei keine Importe enthält, verwenden wir doppelte Anführungszeichen.

Die oben genannten Lösungen haben bei mir nicht funktioniert

Hier ist meine Arbeit, wenn Sie vscode verwenden "tslint.autoFixOnSave": true in Ihrem settings.jsonTestament werden diese Importzitate automatisch korrigiert, wenn Sie die Datei speichern.