EditorConfig Setup for Unified Code Style

Setting Up EditorConfig for Unified Code Style

EditorConfig solves the simplest problem: different editors use different default settings — spaces or tabs, 2 or 4 characters, LF or CRLF. The .editorconfig file in the project root sets these parameters once and for all for the entire team, regardless of editor.

Support is built into VS Code, JetBrains IDE, Vim, Emacs, Sublime Text. For others — a plugin.

.editorconfig

# This file applies to all project files
root = true

# Basic settings for all files
[*]
charset = utf-8
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
indent_style = space
indent_size = 2

# JavaScript and TypeScript
[*.{js,jsx,ts,tsx,mjs,cjs}]
indent_style = space
indent_size = 2
max_line_length = 100

# CSS, SCSS, Less
[*.{css,scss,less,styl}]
indent_style = space
indent_size = 2

# HTML
[*.{html,htm}]
indent_style = space
indent_size = 2

# JSON
[*.json]
indent_style = space
indent_size = 2

# YAML
[*.{yml,yaml}]
indent_style = space
indent_size = 2

# Python (if present in monorepo)
[*.py]
indent_style = space
indent_size = 4
max_line_length = 88

# Go
[*.go]
indent_style = tab
indent_size = 4

# PHP
[*.php]
indent_style = space
indent_size = 4

# Makefile — tabs only
[Makefile]
indent_style = tab

# Markdown — don't trim trailing spaces (two spaces = line break)
[*.md]
trim_trailing_whitespace = false
max_line_length = off

# Binary files — no changes
[*.{png,jpg,jpeg,gif,ico,webp,svg,woff,woff2,eot,ttf,otf,mp4,mp3,pdf,zip}]
insert_final_newline = false
trim_trailing_whitespace = false

Checking Application

# Install editorconfig-checker
npm install --save-dev editorconfig-checker

# Check project
npx ec src/

In CI:

{
  "scripts": {
    "lint:editorconfig": "editorconfig-checker"
  }
}

.ecrc for configuring exceptions:

{
  "Exclude": [
    "dist",
    "node_modules",
    ".git",
    "*.min.js",
    "*.min.css"
  ],
  "ExcludeRegex": "vendor/.*"
}

Interaction with Prettier

EditorConfig and Prettier duplicate some settings (indentation, line breaks). Prettier takes priority in code formatting. EditorConfig applies to files that Prettier doesn't handle: binary files, specific formats, editing in IDE without running Prettier.

Best practice: keep settings consistent:

# .editorconfig
indent_size = 2

// .prettierrc
{
  "tabWidth": 2
}

VS Code Setup Without Plugin

VS Code reads .editorconfig automatically starting with version 1.0 — no plugin needed. Make sure built-in support is active:

// .vscode/settings.json
{
  "files.eol": "\n",          // LF by default on Windows
  "files.insertFinalNewline": true,
  "files.trimTrailingWhitespace": true
}

These settings apply to the editor, .editorconfig — to file saving. If there's a conflict, .editorconfig takes priority.

Timeline

Creating .editorconfig for a project: 15–30 minutes. Fixing existing files to new settings (trailing whitespace, line breaks): run Prettier or editorconfig-checker --fix — 30–60 minutes.