Posted at

Cloud9でTabキーを押した時のインデント幅を変更したい

More than 1 year has passed since last update.


インデント幅が揃わない

何も考えずにコードを書いていたら、ある時GitHub上でソースを共有することになり、「インデント幅を揃えた方が見やすいかも」というアドバイスをいただきました。

確認するとファイルごとにインデント設定が違うようで、マチマチな設定が混在していて困ってしまいました。おそらくクローンしたファイルが入っているため、設定が違っているものが混ざってしまったようです。

初歩的すぎる話のせいかググっても情報が少なくて困りましたが、いろいろ調べてわかったことを、自分メモ兼ねて書いておきます。


  • インデント幅を変更する方法


  • 編集中のファイルでインデント幅を一斉に変える


  • デフォルト設定を直すには



こんな症状

スクリーンショット 2016-12-07 13.42.59.png

(Tabキーを打つごとに、スペースが2つ分開いている)

スクリーンショット 2016-12-07 13.40.59.png

(Tabキーを打つごとに、スペースが4つ分開いている)


インデント幅を変更する方法

Cloud9のエディタでファイルを開くと、右下に文字があります。

スクリーンショット 2016-12-07 13.56.49.jpg

ここで、Spaces:という文字がインデント設定になっています。

クリックすると小窓が立ち上がり・・

スクリーンショット 2016-12-07 13.57.12.png

Tab Sizeという部分で、インデント幅をスペース何個分にしたいかを設定することができる。


編集中のファイルでインデント幅を一斉に変える

この設定を変更しても、すでに入力された部分については、スペース幅が変更されません。

例えば・・


  • Tab Sizeの指し示すスペース数を4→2に減らした場合、すでに入力されたインデント1段(スペース4つ分)は、インデント2段(スペース2つ×2段)と解釈されます。


  • Tab Sizeの指し示すスペース数を2→4に増やした場合、すでに入力されたインデント1段(スペース2つ分)は、そのまま残ります。設定後に入力したインデント(スペース4つ分)の階層から、半段ずれたインデントが残る形になります。


いずれにせよ設定を変えた後に階層がずれて、かえってトラブルのもとになりそうです。

古いインデント設定になっている部分を含めて一斉に幅を変えるためには、


  1. いったん元のインデント幅に戻す。

    仮にインデントをスペース4つ分→2つ分に変更したいとしたら、ここでTab Sizeを4にする

  2. インデント設定画面の下の方にあるConvert to Tabsをクリック

    これで、スペース2つがタブ記号1つに変わる

    スクリーンショット 2016-12-07 14.18.18.png


  3. インデント幅を変更する

    ここで初めてTab Sizeを2にする

  4. 先ほどの画面(小窓の下方)でConvert to Spaces
    を押す。


これで一斉に変更できる。


デフォルト設定を直すには

ファイルごとにやっていると大変なので、新規ファイルに関してはデフォルト幅の設定を変更しておきたい。

1) 右上の歯車アイコンをクリック

2) Code Editor(Ace)をクリック

3) Soft Tabsの設定を変える

これでデフォルト設定が変わります。

スクリーンショット 2016-12-07 12.53.43.png

というわけで、みなさまにも幸せなCloud9ライフを!