ReactのプロジェクトにEditorConfigを導入して文字コードや改行コードを統一する
ReactのプロジェクトにEditorConfigを導入して、文字コードや改行コードを統一します。
文字コードや改行コードを統一することにより、複数人で作業したときに、文字コードや改行コードが勝手に変わってしまうことを防ぎます。
ASP.NET Core + Reactのプロジェクトにeslintとprettierを導入するで作成したプロジェクトに対して修正します。
VSCodeの拡張機能のインストール
EditorConfigをVSCodeで機能させるための拡張機能をインストールします。
ASP.NET Core + Reactの開発環境をDockerで作成するの手順で環境を作成した場合は、以下の設定で、コンテナ起動時に自動で拡張機能をインストールしていますので、この操作は不要です。
.devcontainer.json
"extensions": [
"ms-dotnettools.csharp",
"editorconfig.editorconfig",
"dbaeumer.vscode-eslint",
"esbenp.prettier-vscode"
]
}以下の拡張機能をインストールします。
.editorconfigの作成
.editorconfigというファイル名で、Reactプロジェクトのルートディレクトリ（package.jsonと同じ階層）にファイルを作成します。
設定内容は適宜変更してください。
以下の例では、文字コードはUTF-8、改行コードはLFに設定しています。
.editorconfig# EditorConfig is awesome: https://EditorConfig.org
# top-most EditorConfig file
root = true
[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
[*.md]
trim_trailing_whitespace = false以上で設定は完了です。