VS Codeで行末やファイル末尾の空白文字を削除するには：Visual Studio Code TIPS

VS Codeには行末、ファイル末尾にある不要な空白文字を自動的に削除してくれる機能がある。その機能や設定についてまとめる。

» 2018年12月07日 05時00分公開

　行末やファイル末尾にある余計な空白文字は、ささいなことであるのに開発者の頭を悩ませる問題でもある。Visual Studio Code（以下、VS Code）には、それらを自動的に削除してくれる機能がある。


	操作
編集中に行末およびファイル末尾の不要な空白文字を削除する	コマンドパレットから［末尾の空白のトリミング］コマンドを実行 Windows／Linuxのショートカット：［Ctrl］＋［K］→［Ctrl］＋［X］ macOSのショートカット：［Command］＋［K］→［Command］＋［X］
ファイル保存時に行末およびファイル末尾の不要な空白文字を自動的に削除するかどうかを設定する	ユーザー設定／ワークスペース設定でfiles.trimTrailingWhitespace項目を設定する true：削除する false：削除しない（デフォルト）
自動挿入された空白文字を削除するかどうかを設定する	ユーザー設定／ワークスペース設定でeditor.trimAutoWhitespace項目を設定する true：削除する（デフォルト） false：削除しない
空白文字の自動削除に関する操作や設定項目

編集中に行末およびファイル末尾の不要な空白文字を削除する

　VS Codeでファイルを編集中に、何らかの操作により不要な空白文字が行末やファイル末尾に挿入されることがある。ファイルの編集中にそれらをユーザーが明示的に削除するにはコマンドパレットから［末尾の空白のトリミング］コマンドを実行する（コマンドパレットでは「trim」などと入力して、コマンドを絞り込むとよい）。以下にその様子を示す。

コマンドパレットから［末尾の空白のトリミング］コマンドを実行している様子

　ここでは例として、「Console.WriteLine("Hello World");」行の行末と、ファイル末尾に不要な空白を足している。［末尾の空白のトリミング］コマンドでこれらが削除されるのが分かるはずだ。

　Windows／Linuxでは［Ctrl］＋［K］→［Ctrl］＋［X］キーに、macOSでは［Command］＋［K］→［Command］＋［X］キーにキーボードショートカットが割り当てられているので、頻繁に使用する方はこれらを覚えておくようにしよう。

ファイル保存時に行末およびファイル末尾の不要な空白文字を自動的に削除するかどうかを設定する

　上と同様な処理を、ファイル保存時に自動的に行うことも可能だ。これにはユーザー設定／ワークスペース設定でfiles.trimTrailingWhitespace項目を設定する。自動的に削除するならこの項目の値をtrueに、削除しないならfalseに設定する。

新しい設定エディタでfiles.trimTrailingWhitespace項目を設定しているところ

files.trimTrailingWhitespace項目で、ファイル保存時に不要な空白文字を自動的に削除するかどうかを指定
上は新しい設定エディタで設定しているところ。下はsettings.jsonファイルを直接編集しているところ。

　この項目の値をtrueにして、前項と同様に不要な空白文字を足したファイルを保存している様子を以下に示す。

files.trimTrailingWhitespace項目の値をtrueにすると、ファイル保存時に行末およびファイル末尾の不要な空白文字が自動的に削除される

自動挿入された空白文字を削除するかどうかを設定する

　上の設定画面を見ると、「editor.trimAutoWhitespace」（Editor: Trim Auto Whitespace）という項目があることも分かる。その説明は「自動挿入された末尾の空白を削除します」となっている。最後にこの項目についても説明をしておこう。

　これはVS Codeにより自動的に挿入された「インデント用の空白文字」を「その行が空白文字だけの場合に自動的に削除する」かどうかを指定するものだ。デフォルト値はtrueであり、「上の条件に合致する場合は削除する」ことを意味する。falseにした場合は「削除しない」ことを意味する。

　具体的にはプログラムコードを記述しているときに［Enter］キーを押すと、改行された後に、前の行の内容に応じて、VS Codeは必要な量のインデントを自動的に挿入してくれる。さらに続けて［Enter］キーを押すと、その行は「空白文字だけで構成される」ようになる。このような行について「空白文字を残すのか削除するのか」を指定するのがこの項目だ。

　この値をfalseにした場合の動作を以下に示す。

editor.trimAutoWhitespace項目をfalseにした場合

　上のGIFアニメは「Console.WriteLine("Hello World");」行の末尾にカーソルを置いて、［Enter］キーを3回押しているところだ。［Enter］キーを押すごとに、適切なインデントが自動的に挿入されていることが分かる。だが、インデントを示す空白文字だけしかないのであれば、それらは空行（改行のみの行）でもよいだろう。この項目をtrueにすると、そうした空白文字が自動的に削除されるようになる（デフォルト）。その様子を以下に示す。