Language-tools: Auto-Importe sind in VSCode inkonsistent

Erstellt am 9. Juli 2020 · 3Kommentare · Quelle: sveltejs/language-tools

Beschreibe den Fehler
Das ist rein ästhetisch. Beim automatischen Importieren einer Datei oder Komponente in VScode werden die neuen Importe nicht richtig zu den Dateien hinzugefügt.

Sie werden _oberhalb_ bestehender Importe eingefügt.
Sie werden an verschiedenen Positionen für .ts und .svelte Dateien eingefügt.
Sie ignorieren die quoteStyle-Einstellungen des Editors.
- Mit typescript.preferences.quoteStyle: single in VSCode werden Importe beispielsweise weiterhin doppelte Anführungszeichen verwenden.
Ihnen fehlt die Einrückung.

Fortpflanzen
Erstellen Sie ein neues Projekt aus sveltejs/template , erstellen Sie eine leere Test.svelte Komponente und importieren Sie sie automatisch in App.svelte . In TypeScript-Projekten können Sie auch sehen, dass Importe aus .ts Dateien direkt nach dem script-Tag ohne Zeilenumbruch eingefügt werden.

Example

Erwartetes Verhalten
Ich erwarte, dass der automatische Import genauso funktioniert wie in einer normalen .ts Datei, jedoch mit einer Einrückung aufgrund des Skript-Tags.

Mit richtiger Einrückung einfügen, insbesondere nach bestehenden Importen.
Fügen Sie unterhalb vorhandener Importe ein.
Für alle Dateitypen konsistent einfügen.
Verwenden Sie den Zitatstil des Editors, falls verfügbar.

Mein Code hätte ohne manuelle Arbeit so aussehen sollen:

<script lang="ts">
    import Test from './Test.svelte';
    import { testStore } from './test';

    export let name;
</script>

System (bitte füllen Sie die folgenden Informationen aus):

Betriebssystem: Windows 10
IDE: VSCode, 1.46.1
Plugin/Paket: Svelte für VSCode, 101.1.1

Fixed bug

Quelle

baileyherbert

Alle 3 Kommentare

Das zugrunde liegende Problem besteht darin, dass der schlanke Compiler beim Importieren innerhalb der Vorlage Fehler ausgibt, da der Code zu diesem Zeitpunkt ungültig ist. Auf diese Weise kann svelte2tsx keine gültige tsx Datei erzeugen, also greifen wir darauf zurück, nur den Inhalt des Skript-Tags zu verwenden. Wenn der Parser gültigen Code ausgibt, erzeugt svelte2tsx eine konvertierte tsx Datei. Dadurch fügt TypeScript die Importe an einer anderen Stelle ein und unser Mapping vom generierten tsx zum ursprünglichen svelte importiert es oben. Ich bin mir nicht sicher, wie wir diese Probleme gut umgehen können. Das Einhalten der Benutzereinstellungen (Zitatstil) sollte jedoch machbar sein. Als Workaround können Sie den Befehl "Importe organisieren" verwenden, und die schönere Formatierung kümmert sich um die Einrückungs- und Anführungszeichen.

dummdidumm am 9. Juli 2020

👍1

Danke @dummdidumm für die Klarstellung und den Workaround! 😄

Wenn es eine Möglichkeit gibt, sie unterhalb bestehender Importe einzufügen, wäre dies eine massive Verbesserung gegenüber der derzeitigen Funktionsweise. Die Erweiterung wäre etwas vorzeigbarer (wie in Video-Tutorials), und was noch wichtiger ist, die Importe würden sich konsistent anfühlen (es ist ungewöhnlich, nach dem neuesten Import zu suchen).

Ich habe gerade drei Importe ( test , test2 , test3 in dieser Reihenfolge) mit Vetur getestet und sie wurden an den richtigen Positionen eingefügt. Hier die Ergebnisse zum Vergleich:

Vetur:

<script lang="ts">
  import Vue from 'vue';
import { testStore1 } from './test';
import { testStore2 } from './test2';
import { testStore3 } from './test3';

  export default Vue.extend({ /*...*/ });
</script>

Svelte für VSCode:

<script lang="ts">import { testStore3 } from "./test3";
import { testStore2 } from "./test2";

import { testStore } from "./test";


    export let name: string;

</script>

baileyherbert am 9. Juli 2020

Die js/ts hat ein anderes Problem. Die Quellzuordnung kann die nächste Zeile des letzten Imports nicht an ihre ursprüngliche Position zuordnen.

jasonlyu123 am 14. Juli 2020

👍1

War diese Seite hilfreich?

0 / 5 - 0 Bewertungen

Language-tools: Auto-Importe sind in VSCode inkonsistent

Alle 3 Kommentare

Verwandte Themen