Language-tools: VSCode で自動インポートに一貫性がない

根本的な問題は、テンプレート内でのインポート中に、その時点でコードが無効になるため、svelte コンパイラがエラーをスローすることです。 そうすると、 svelte2tsxは有効なtsxファイルを生成できないため、スクリプトタグのコンテンツのみを使用することになります。 パーサーが有効なコードを出力する場合、 svelte2tsxは変換されたtsxファイルを生成します。 これにより、TypeScript はインポートを別の場所に挿入し、生成されたtsxから元のsvelteへのマッピングはそれを上部にインポートします。 これらの問題を良い方法で回避する方法がわかりません。 ただし、ユーザーの好み (引用スタイル) に従うことは可能です。 回避策として、「インポートの整理」コマンドを使用すると、よりきれいなフォーマットでインデントと引用符のスタイルが処理されます。

@dummdidummの説明と回避策に感謝します。 😄

それらを既存のインポートの下に挿入する方法があれば、現在の動作よりも大幅に改善されます。 拡張機能は (ビデオ チュートリアルのように) もう少し見やすくなり、さらに重要なことに、インポートは一貫性を感じます (最新のインポートを一番上に探すのは珍しいことです)。

Vetur で 3 つのインポート ( test 、 test2 、 test3順) をテストしたところ、正しい位置に挿入されました。 比較した結果は次のとおりです。

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>

VSCode の Svelte:

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

import { testStore } from "./test";


    export let name: string;

</script>

js/ts には別の問題があります。 ソースマップは、最後のインポートの次の行を元の位置にマップできません。