LoginSignup
4
3

More than 3 years have passed since last update.

EditorConfig

Posted at

EditorConfigを使うと、異なるエディタを使っているメンバーとコーディングスタイルを揃える事ができます。
一人の作業でも簡単なコードフォーマットに使う事ができます。
導入が容易なのでお薦めです。

エディタ側の準備

必要なプラグインをインストールします。

エディタ プラグイン
Brackets EditorConfig for Brackets
VS Code EditorConfig for VS Code
Atom EditorConfig

プラグインが不要なエディタもあります。

.editorconfigファイルのサンプル

これだけです。
古いWindowsを使っていて「.」で始まるファイルを作れない場合は、末尾にも「.」を付けると作れます。
作るのが面倒な場合はこちらから https://github.com/takeshisakuma/editorconfig

root = true

[*]
charset = utf-8
indent_style = space
indent_size = 2
trim_trailing_whitespace = true
insert_final_newline = true
end_of_line = lf

[*.md]
trim_trailing_whitespace = false

各設定の意味

root

.editorconfigが同階層に存在しない場合に、ルートに存在する.editorconfigファイルを参照する仕組みになっています。
これをtrueにしておかないとルート・ディレクトリまでたどってしまうのでroot = trueは最初に書いておきます。

[]

対象ファイルの指定
[*]で全てのファイルを対象とします。
[*.md]で拡張子が.mdの全てのファイルを対象とします。
[index.html]でindex.htmlのみを対象とします。
[!index.html]でindex.html以外の全てのファイルを対象とします。

indent_style

インデントをタブにするか、スペースにするかの指定です。
tabかspaceを指定可能です。

indent_size

インデントを半角スペースいくつ分にするかの指定です。
通常2か4を指定します。

tab_width

タブの幅の指定です。
省略するとindent_sizeの数値が適応されるので、通常は指定する必要がありません。

end_of_line

改行コードの種類を指定します。
lfかcrかcrlfを指定できます。

改行コードの種類 意味 OS
LF(Line Feed) カーソルを新しい行に移動 UNIXなど
CR(Carriage Return) カーソルを新しい行に移動 UNIXなど
CR+LF 左端にカーソルを戻して改行 Windowsなど

charset

文字コードの指定です。
特に理由が無ければutf-8指定します。

trim_trailing_whitespace

行末の空白を削除するかどうかの指定です。
trueかfalseを指定可能です。
マークダウンファイルの場合、「行末スペース2つ」に改行というに意味があるので、削除しないためにfalseにします。

insert_final_newline

最終行に空行を入れるかどうかの指定です。
trueかfalseを指定します。

コメントアウト

行頭に「#」か「;」でコメントアウトできます。

.editorConfigファイルの配置

プロジェクトのルートに置きます。

確認

行末にスペースを入力してファイルを保存して、スペースが削除されるかなど、設定の通りに動作するか確認します。

4
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
3