Visual Studio Code Intellisense とオートコンプリート - Vite、JSconfig、およびエイリアス - 正しい組み合わせを見つけられない

Question

PHPStorm/Webstorm を何年も使用した後、Visual Studio Code を再び使い始めました

私が移行を決意したのは、単に VSCode が非常に軽量であり、VSCode はほぼどこでも無料で利用できるため、有料サービスに依存したくなく、すべてのコンピュータにインストールしたくなかったからです。

最初からやり直します

Vite Vue3

今、いくつかの問題が発生しました 輸入 CTRL クリック - 参照に移動 自動完了

私の Vite.config は次のとおりです - エイリアスを有効にします

リーリー

これで、vite 構成だけで、「@」エイリアスを使用してインポートできますが、インテリセンスは発生しません。 インポートをオートコンプリートすることも、Ctrl キーを押しながらクリックすることもできません

jsconfig.json ファイルを追加した後

リーリー

「@」を使用してコンポーネントをインポートできるようになり、完全なインテリセンスを使用してコンポーネントを CTRL キーを押しながらクリックできるようになりました ただし、今では、node_modules をインポートする機能を失いました。すべてのインテリセンスが失われています。

つまり、vite/jsconfig を使用すると、Ctrl キーを押しながらクリック/オートコンプリートで「@」エイリアスを入力できます しかし、node_moduleインポート関数を失いました

これらの vite.config エイリアス設定を削除し、jsconfig を削除すると node_module インテリセンスを取り戻しましたが、プロジェクトのインテリセンスを失いました。

ここで何が欠けているのでしょうか?この問題の解決を手伝ってください。

また、どのように機能するかを理解できるように、npm import 拡張機能をすべて削除しました。

Answer 1

jsconfig.json ファイルによる問題。

ディレクトリに jsconfig.json ファイルが存在することは、そのディレクトリが JavaScript プロジェクトのルート ディレクトリであることを示しています。 jsconfig.json ファイルは、JavaScript 言語サービスによって提供される機能のルート ファイルとオプション (vscode) を指定します。

ほとんどの場合、これは必要ありませんが、IntelliSense Customization など、使用できる例がいくつかあります。 ＃＃＃例＃＃＃＃＃＃ 詳細:

jsconfig.json

は、TypeScript 構成ファイルである

tsconfig.json の子孫です。 jsconfig.json は tsconfig.json であり、"allowJs" プロパティが true に設定されており、JavaScript# が存在しないためです。実際にコンパイルされた ## が必要です。これらのプロパティが存在するのは、jsconfig.json が tsconfig.json の (単なる) 子孫であるためです。 したがって、すべてのオプションが target: と同じというわけではありません。

ただし、vscode IntelliSense はこれらの変更の影響を受ける可能性があります。したがって、それを削除すると、すべてが期待どおりに動作します。

つまり、target

は

jsconfig.json

の IntelliSense に影響を与える可能性があります。

あなたの場合は、次のように追加するだけです:

jsconfig.json

リーリー

vite.config.js リーリー

vscode の jsconfig.json の詳細:

こちら