/eslint-config-codecraft

Codecraft.dev ESLint config

Codecraft ESLint config

ESLint config which sets up EditorConfig + Prettier to run as part of the linting process. It also automatically sorts imports and adds a few opinionated linting rules.

Install

npm i -D eslint-config-codecraft

Usage

  1. Add an .editorconfig file in the project root.

    For example, to use UTF-8 encoding with Unix style newlines, 4 space indentation, and strict whitespace formatting:

    root = true

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

  2. Optionally add a .prettierrc file in the project root to configure any options which are not inherited from EditorConfig.

    For example, to omit semicolons and use single quotes for strings:

    {
	"semi": false,
	"singleQuote": true
}

  3. Add codecraft as the last extension in your .eslintrc.json:

    {
	"extends": [
		// ...
		"codecraft"
	]
}

Linting rules

A few opinionated rules have been introduced to improve consistency with idioms in other programming languages, and reduce developers' cognitive load when switching between them.

Strict equality

This rule prohibits the usage of loose equality operators to avoid ambiguity and potential errors.

// GOOD
foo === bar
foo !== bar
// BAD
foo == bar
foo != bar

Rationale:

Block scoped variables

This configuration prohibits usage of var due to its unintuitive scoping, and enforces usage of block scoped variables. However, unlike common recommendations, it favors let keyword instead of const in almost all cases, to improve semantics and consistency with other mutable storage (function arguments, object properties).

// GOOD
const TOP_LEVEL_CONSTANT = "foo"
let topLevelVariable = "bar"

function nestedScope() {
	let nestedVariable = "baz"
}
// BAD
function nestedScope() {
	const NESTED_CONSTANT = "foo"
}

Rationale:

Tips

Pre-commit hook

Format files via NPM's Git pre-commit hook in package.json:

{
	"scripts": {
		"precommit": "eslint"
	}
}

Automatic formatting

If using VSCode, install the official ESLint extension and add the following options to your project settings to automatically format files on save:

{
	"editor.formatOnSave": true,
	"eslint.format.enable": true,
	"[javascript]": {
		"editor.defaultFormatter": "dbaeumer.vscode-eslint"
	}
}