「Trailing Spaces」という拡張機能
自分が出したプルリクエストをレビューしていただいたときに、こんな指摘をもらった。
レビュアーの先輩エンジニア
「def createのあとにいらない半角スペース入ってしまっているので、消しておいてください」
ぼく
「あ、はい。ありがとうございます。(すげーよくこんな細かいところ気づくなこの人、、、、)」
こんなやりとりが実際に僕の体験としてありました。
そのときに、なぜこんな細かいところに気づくのかと質問してみたところ、VSCodeのある拡張機能を入れているとのことだった。
「Trailing Spaces」
このTrailing Spaces という拡張機能をVSCodeに入れれば、スペースをハイライトしてくれる。
例えばこんな感じ↓

この画像のように、スペースがあるところには赤でわかりやすく表示してくれる。
Trailing Spacesのインストール手順
導入はとても簡単で、VSCodeの拡張機能マーケットプレイスから数クリックで設定できる。
- VSCodeを開き、左サイドバーの拡張機能アイコン(四角が4つのマーク)をクリックする。
- 検索ボックスに「Trailing Spaces」と入力する。
- 「shardulm94」が公開している拡張機能を選んで「インストール」をクリックする。
- インストールが終わると、行末の不要な半角スペースが自動で赤くハイライトされるようになる。
保存時に不要なスペースを自動で削除する設定
ハイライト表示だけでなく、ファイルを保存したタイミングで不要なスペースを自動的に取り除くこともできる。VSCodeの設定(settings.json)に次の1行を追加すればいい。
"trailing-spaces.trimOnSave": true
この設定を入れておくと、保存するたびに行末の余分なスペースが消えるので、レビューで指摘される前に自分で防げる。
なぜ不要なスペースを消すのか
行末の余分なスペースは動作に影響しないことが多いけど、Gitの差分(diff)に余計な変更として現れたり、コードの一貫性を損なったりする。チーム開発では「不要なスペースを残さない」のがレビューの基本マナーになっている現場も多く、この拡張機能はそういう細かい指摘を未然に防いでくれる。
関連記事
VSCodeをもっと快適に使うためのTipsはこっちでも紹介している。VSCodeでディレクトリ一覧を一気に折りたたむ方法では、ファイルツリーの操作を効率化する方法をまとめた。SQLエディタを使うなら【DBeaver】SQLエディタの文字を拡大(元に戻す)する方法も参考になるはず。
ぜひ、この拡張機能は入れておこう。
