Sublime Text 3でスペース(半角・全角)やタブを可視化する方法

2014/11/11

Sublime Text 3 の初期インストール状態では、タブやスペースに色がついていないため、一体何が設定されているのか文字を反転させないと分からない状態となっています。

以下のソースの L.7 ~ L.11 のインデントはスペースのみでしょうか、タブ混在でしょうか?ひょっとして全角スペースも混ざってたりしていないでしょうか?

highlight-whitespace-characters-on-sublime-text01

半角スペースやタブは設定で見えるようにできる

Sublime Text で設定を行えば、スペースやタブは可視化できるようになります。残念ながら全角スペースは設定だけでは可視化できないので、そちらについては後述で。

メニュー [基本設定] → [基本設定 – ユーザ] を開きます。日本語化していない場合は、[Preference] → [Settings – User]

highlight-whitespace-characters-on-sublime-text02

Sublime Text 3 の場合、このような画面が表示されます。ここで空白を可視化するために、以下のコードを付け加えます。

"draw_white_space": "all"

この設定ファイルは JSON 形式で記載されているので、それぞれの項目はカンマ区切りで、要素と値は半角コロンで設定するようにしてください。実際に設定した例が以下の画像です。

highlight-whitespace-characters-on-sublime-text03

ここで設定値として「all」を指定しましたが、他に「selection」と「none」の設定が可能です。「selection」はデフォルト値です。文字列を選択した場合に、空白文字の状態が分かるようになります。「all」は常に表示する場合に指定します。そして「none」はスペースの描画を行いません。つまり入力しようが選択しようが、分からないままです。

設定後、保存するとご覧の通り、半角スペースが可視化された状態となります。(タブも同様に可視化されます。)

highlight-whitespace-characters-on-sublime-text04

全角スペースが混ざっていたら識別できない

実際に一部の半角スペースを全角に変換してみると、以下の状態になります。

highlight-whitespace-characters-on-sublime-text05

こちら、全角スペース 2文字分なのです。Sublime Text では全角スペースだからと言って 2文字分の幅で設定されないのが難点ですね。日本語入力モードのままスペース入力しても、全角スペースが入力されたと一瞬では気付きません。

全角スペースを設定で可視化することはできないので、ここはプラグインを用いて可視化するようにします。

TralingSpaces で全角スペースを可視化する

プラグインは「Package Control」を利用してのインストールを行いますので、Package Control をインストールしていない場合は、こちらのエントリーの「Package Control のインストール」を参照ください。

【導入&日本語化】Sublime Text はプログラミングに最適なエディタ!
長年テキストエディタとして サクラエディタ を使用してきたのですが、もう一歩踏み込んだ機能が欲しくて、新たなテキストエディタとの出会いを求めていた昨今。ようや...
  1. メニューから ツール(T) > コマンドパレット を選択
  2. Package Control: Install Package を選択
  3. 別のパレットが立ち上がるので TralingSpaces を検索し、選択

TralingSpaces の設定

TralingSpaces のインストールが完了すると、同プラグインのメニューが登場します。

[基本設定] → [PackageSetting] → [TrailingSpaces] → [Setting – User]

インストール直後の場合、設定ファイルの中身は空っぽです。全角スペースを可視化すべく、以下のコードを記載して保存してください。

{
    "trailing_spaces_regexp": " |[ \t]+"
}

これでご覧の通り、全角スペースも可視化することができるようになりました。

highlight-whitespace-characters-on-sublime-text06

TralingSpaces は行末の余白を表示するプラグイン

名前の通り「TralingSpaces」は、行末の余白をハイライトしてくれるプラグインです。上記サンプルの設定を適用すると、行末のスペースについてもハイライトされるようになります。

単に全角スペースをハイライトする為だけのプラグインではありませんので、その点ご注意ください。

Name :
気力・体力勝負なシステム業界のエンジニアを経て、個人事業主として独立。Web サイト運営、動画制作など活動の場を広げています。目指すところへの道のりは険しいですが、自分が自分らしくあるために、一歩ずつ進んでいきます。

このブログでは、困ってたどり着いた人に、分かりやすく答えを提供できるように心掛けています。更新情報は、Twitter や Facebook ページを参照ください。よろしければフォローお待ちしています。

プロフィール詳細 Twitter @_NJ69_
Facebook ページ NJ-CLUCKER シェア
このブログが役に立ったら
「いいね!」お願いします
PAGE TOP ↑