サイト制作に関するメモ書き

HOME > その他 > EditorConfigを使ってみる

EditorConfigを使ってみる

インデントや文字コード、改行コードなどの設定をエディタ間で統一できる「EditorConfig」を使ってみます。
一人で作業する場合はそれほど気になりませんが、複数人で作業をするときは設定が統一できて便利です。

プラグインの追加

プラグインが不要なエディタとプラグインの追加が必要なエディタがあるようです。
詳しくは公式サイトにてご確認ください。
インストールしたいエディタのアイコンをクリックすると、インスト―ル方法も表示されます。

今回はAtomを使ってみます。
ファイル > 環境設定 を選択します。

Installをクリックします。

editorconfigと検索します。

検索結果に表示されたeditorconfigをインストールすれば完了です。

 

記述方法

EditorConfigを実際に使ってみます。
.editorconfigというファイルを作成して、その中に設定内容を記述していきます。
改行コードがCRLFまたはLF、文字コードがUTF-8である必要があるので注意してください。

サンプルとして、以下のように設定してみました。

.editorconfig

# このファイルがプロジェクトのルートディレクトリにあるかどうか
root = true

# すべてのファイル
[*]
# インデントの設定
indent_style = space
#インデントの幅
indent_size = 2
# 改行コードの設定
end_of_line = lf
# 文字コードの設定
charset = utf-8
# 行末の空白文字を削除するかどうか
trim_trailing_whitespace = true
# 最後の行に空行を入れるかどうか
insert_final_newline = true

# 後に記述した設定が上書きされる
# jsファイルのみインデントの幅を変更
[*.js]
indent_size = 4

# Markdownは行末に2つ以上スペースを入れると改行になるため、
# 行末のスペースを削除しないようにする
[*.md]
trim_trailing_whitespace = false

行頭が#の行はコメントになります。
ファイルの種類をワイルドカードを使って [ ] 内に指定して、その後で「プロパティ = 値」の形でルールを設定します。
 

ワイルドカード

ワイルドカードはルールを設定するファイルを指定するのに使用します。
以下のような種類があります。

* パス区切り文字(/)を除く任意の文字列に一致するファイル。
** 任意の文字列に一致するファイル。
? 任意の1文字に一致するファイル。
[name] nameに一致するファイル。
[!name] nameに一致しないファイル。
{s1,s2,s3} s1,s2,s3のいずれかに一致するファイル。
{num1..num2} num1とnum2の間の任意の整数に一致するファイル。

 

プロパティ

プロパティを使ってファイルごとのルールを設定します。
プロパティが指定されていない場合、エディタの設定が使用されます。

indent_style インデントの設定。「tab」か「space」
indent_size インデントの幅。整数
tab_width indent_styleでtabを設定している場合のインデントの幅。
tab_widthを設定していない場合はindent_sizeが使用されるので、通常は設定する必要はありません。
end_of_line 改行コードの設定。「lf」か「cr」か「crlf」
charset 文字コードの設定。「latin1」か「utf-8」か「utf-8-bom」か「utf-16be」か「utf-16le」
通常はutf-8で問題ないです。
trim_trailing_whitespace 行末の空白文字を削除するかどうか
insert_final_newline 最後の行に空行を入れるかどうか
root このファイルがルートディレクトリにあるかどうか
trueの場合、上位階層の.editorconfigを探索しなくなる

そのほかのプロパティについては公式のWikiでご確認ください。
すべてのプラグインでサポートされているわけではないようなので注意してください。
 

【参考サイト】

 

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

▲PAGE TOP