阿部 隼也

general

VSCodeでのSvelteKit開発体験を10倍に向上させる9つのヒント

SvelteKitとVSCode(Cursor)の組み合わせは非常に強力ですが、デフォルトのままではファイル名がすべて +page.svelte や +layout.server.ts となってしまい、どのルートに属するファイルなのか判別しづらいことがあります。 ここでは、そのような問題に対して、ほんの数分の設定変更や拡張機能の導入で劇的に開発効率を上げる9つのヒントをご紹介します。 1. タブに表示されるファイル名を短くする VSCodeのタブにはデフォルトでフルパスが表示されますが、SvelteKitではすべて +page.svelte と同じ名前になりがち。 // settings.json "workbench.editor.labelFormat": "short" これを "short" にすると、タブ上に必ず「ディレクトリ名/+page.svelte」のように表示され、どのルートのファイルか一目瞭然になります。 2. エクスプローラーでファイルを先に表示する ネストが深いルート配下で「フォルダー>ファイル」の並びだと、どのファイルなのかパッとわかりにくい

By 阿部 隼也