みなさんは、コーディングをするさいのインデントや文字コードなどのコードのフォーマットはコーディングルールは使っているエディターに依存しているかと思います。エディターでの設定でしっかり作っている場合は問題ありませんが、エディターを変更したらまた1から設定を作らないといけないので大変です。

そこでEditorConfigを活用して最低限の設定を統一していくとエディターを変えても最低限の保証ができるのでオススメです。

EditorConfigとは

EditorConfigはどんなエディターを使ってもコーディングをするときの書き方を統一できるようにするためのルールをプロジェクト内で適用するためのツールです。

基本的にEditorConfigのプラグインが提供されているエディターならEditorConfigを使えばEditorConfigがあるプロジェクト内のコードを書くためのフォーマットは統一できます。

これの何がいいかといえば、先ほど書いたようにエディターを変えても最低限のフォーマットは統一されていることとチームで開発する場合にコーディングするときのズレを減らすことができます。

あくまでコードを書くときのフォーマットなので各プログラミング言語のフォーマット形式には対応しません。それらはコードを描き終わってから言語専用のツールを使ってフォーマットするものになります。

EditorConfigの設定

EditorConfigは.editorconfigというファイルをコードを書いているプロジェクトのルートディレクトリにおけばエディターのプラグインがファイルを読み込んで設定されるようになります。

ファイル自体も簡単に書けるような感じになっています。

.editorconfig
root = true

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

[*.js]
indent_size = 2

[*.yml]
indent_size = 2

上記のファイルの見方は、3行目の[*]がプロジェクト全体のフォーマットの設定でインデントのサイズやスタイル・文字コードや行末の空白を削除するかどうかなどの設定を入れてます。

11行目の[*.js]や14行目の[*.yml]はファイルの拡張子がjsの場合とymlの場合に適用するフォーマットの設定を入れてる形です。

適用したいファイルのフォーマットを正規表現やファイル名の決め打ちで設定することができます。

EditorConfigのプロパティ

EditorConfigで設定できるプロパティは以下の通りです。これらは必要なプロパティのみ設定をすればOKです。

プロパティ名説明サンプル
indent_styleインデントのスタイルをタブにするかスペースにするか
(tab or space)
space
indent_sizeインデントをするときの文字数4
tab_widthインデントをするときのタブの幅4
end_of_line行末の改行コードlf
charsetファイルの文字コードutf-8
trim_trailing_whitespace行末の空白を削除するかどうか
(true or false)
true
insert_final_newlineファイルの最終行に改行を入れるかどうか
(true or false)
true
max_line_length1行に入力できる文字数
(対応しているプラグインがあるエディターのみ)
120

まとめ

今回はEditorConfigについて紹介しました。EditorConfigを使えばチームでの開発はもちろんのこと個人でもそれなりに書き方の制御ができるのでコーディングにおけるズレは減ります。

コーディングし終わったファイルに対してはそこまでのフォーマットの力は発揮されませんが、コーディング中におけるEditorConfigの設定はそこそこ有効なので導入してみてはどうでしょうか?