eslint-plugin-unicorn Documentation

npm install --save-dev eslint eslint-plugin-unicorn

import unicorn from 'eslint-plugin-unicorn';
import {defineConfig} from 'eslint/config';
import globals from 'globals';

export default defineConfig([
	{
		files: ['**/*.js'],
		languageOptions: {
			globals: globals.builtin,
		},
		plugins: {
			unicorn,
		},
		rules: {
			'unicorn/prefer-module': 'error',
			'unicorn/…': 'error',
		},
	},
	// …
]);

import typescriptEslintParser from '@typescript-eslint/parser';
import unicorn from 'eslint-plugin-unicorn';
import {defineConfig} from 'eslint/config';
import globals from 'globals';

export default defineConfig([
	{
		files: ['**/*.ts'],
		languageOptions: {
			globals: globals.builtin,
			parser: typescriptEslintParser,
		},
		plugins: {
			unicorn,
		},
		rules: {
			'unicorn/prefer-module': 'error',
			'unicorn/…': 'error',
		},
	},
	// …
]);

import css from '@eslint/css';
import json from '@eslint/json';
import markdown from '@eslint/markdown';
import html from '@html-eslint/eslint-plugin';
import unicorn from 'eslint-plugin-unicorn';
import {defineConfig} from 'eslint/config';

export default defineConfig([
	{
		files: ['**/*.js'],
		plugins: {
			unicorn,
		},
		extends: [
			'unicorn/recommended',
		],
	},
	{
		files: ['**/*.json'],
		plugins: {
			json,
			unicorn,
		},
		language: 'json/json',
		rules: {
			'unicorn/no-empty-file': 'error',
			'unicorn/prefer-https': 'error',
		},
	},
	{
		files: ['**/*.css'],
		plugins: {
			css,
			unicorn,
		},
		language: 'css/css',
		rules: {
			'unicorn/prefer-explicit-viewport-units': 'error',
			'unicorn/prefer-https': 'error',
			'unicorn/text-encoding-identifier-case': 'error',
		},
	},
	{
		files: ['**/*.html'],
		plugins: {
			html,
			unicorn,
		},
		language: 'html/html',
		rules: {
			'unicorn/no-invalid-file-input-accept': 'error',
			'unicorn/prefer-https': 'error',
		},
	},
	{
		files: ['**/*.md'],
		plugins: {
			markdown,
			unicorn,
		},
		language: 'markdown/commonmark',
		rules: {
			'unicorn/expiring-todo-comments': 'error',
			'unicorn/prefer-https': 'error',
		},
	},
]);

import unicorn from 'eslint-plugin-unicorn';
import {defineConfig} from 'eslint/config';

export default defineConfig([
	// …
	{
		files: ['**/*.js'],
		plugins: {
			unicorn,
		},
		extends: [
			'unicorn/recommended',
		],
		rules: {
			'unicorn/prefer-module': 'warn',
		},
	},
]);

import unicorn from 'eslint-plugin-unicorn';
import {defineConfig} from 'eslint/config';

export default defineConfig([
	// …
	{
		files: ['**/*.js'],
		plugins: {
			unicorn,
		},
		extends: [
			'unicorn/all',
		],
		rules: {
			'unicorn/prefer-module': 'warn',
		},
	},
]);

// ❌
try {} catch (badName) {}

// ✅
try {} catch (error) {}

// ❌
promise.catch(badName => {});

// ✅
promise.catch(error => {});

// ❌
promise.then(undefined, badName => {});

// ✅
promise.then(undefined, error => {});

// ❌
try {} catch (_) {
	console.log(_);
}

// ✅
// Underscore is allowed when the error is not used
try {} catch (_) {
	// error is not used
}

// ✅
// Descriptive name is allowed
try {} catch (fsError) {}

// ✅
// `error_` is allowed because of shadowed variables
try {} catch (error_) {
	const error = new Error('🦄');
}

'unicorn/catch-error-name': [
	'error',
	{
		name: 'exception',
	},
]

'unicorn/catch-error-name': [
	'error',
	{
		ignore: [
			'^error\\d*$',
			/^ignore/i,
		],
	},
]

try {} catch (pony) {}

try {} catch (unicorn) {}

import assert from 'node:assert/strict';

assert.strictEqual(actual, expected);
assert.deepStrictEqual(actual, expected);

// ❌
assert(divide(10, 2) === 5);

// ✅
assert.ok(divide(10, 2) === 5);

import assert from 'node:assert';

assert.strictEqual(actual, expected);
assert.deepStrictEqual(actual, expected);

// ❌
assert(divide(10, 2) === 5);

// ✅
assert.ok(divide(10, 2) === 5);

import {strict as assert} from 'node:assert';

assert.strictEqual(actual, expected);
assert.deepStrictEqual(actual, expected);

// ❌
assert(divide(10, 2) === 5);

// ✅
assert.ok(divide(10, 2) === 5);

// ❌
new Date(date.getTime());

// ✅
new Date(date);

// ❌
const cloned = new Date(originalDate.getTime());

// ✅
const cloned = new Date(originalDate);

// ✅
// When you need just the timestamp value
const timestamp = date.getTime();

// ❌
const {a} = foo;
console.log(foo.a);

// ✅
const {a} = foo;
console.log(a);

// ✅
console.log(foo.a, foo.b);

// ✅
const {a} = foo;
console.log(a, foo.b);

// ✅
const {
	a: {b},
} = foo;
console.log(foo.a.c);

// ❌
const {bar} = foo;
const {a} = foo.bar;

// ✅
const {bar} = foo;
const {a} = bar;

// ✅
const {a} = foo;
console.log(a, foo.b());

// ✅
const {a} = foo.bar;
console.log(foo.bar.a);

// ❌
const array = [
	a,
	...(foo ? [b, c] : ''),
];

// ❌
const array = [
	a,
	...(foo ? 'bc' : []),
];

// ✅
const array = [
	a,
	...(foo ? [b, c] : []),
];

// ✅
const array = [
	a,
	...(foo ? 'bc' : ''),
];

const index = foo.indexOf('bar');

// ❌
if (index < 0) {}

// ✅
if (index === -1) {}

const index = foo.indexOf('bar');

// ❌
if (index >= 0) {}

// ✅
if (index !== -1) {}

const index = foo.indexOf('bar');

// ❌
if (index > -1) {}

// ✅
if (index !== -1) {}

const index = foo.lastIndexOf('bar');

// ❌
if (index >= 0) {}

// ✅
if (index !== -1) {}

const index = array.findIndex(element => element > 10);

// ❌
if (index < 0) {}

// ✅
if (index === -1) {}

const index = array.findLastIndex(element => element > 10);

// ❌
if (index < 0) {}

// ✅
if (index === -1) {}

// ❌
export function doFoo(foo) {
	// Does not capture anything from the scope, can be moved to the outer scope
	function doBar(bar) {
		return bar === 'bar';
	}

	return doBar;
}

// ✅
function doBar(bar) {
	return bar === 'bar';
}

export function doFoo(foo) {
	return doBar;
}

// ❌
function doFoo() {
	// Does not capture anything from the scope, can be moved to the outer scope
	return bar => bar === 'bar';
}

// ✅
const doBar = bar => bar === 'bar';

function doFoo() {
	return doBar;
}

// Arrow functions in return statements are also flagged
// ❌
export function someAction() {
	return dispatch => dispatch({type: 'SOME_TYPE'});
}

// Arrow functions in return statements are also flagged
// ✅
const handleDispatch = dispatch => dispatch({type: 'SOME_TYPE'});

export function someAction() {
	return handleDispatch;
}

// ❌
function doFoo(foo) {
	const doBar = bar => {
		return bar === 'bar';
	};
}

// ✅
const doBar = bar => {
	return bar === 'bar';
};

function doFoo(foo) {}

// ✅
export function doFoo(foo) {
	function doBar(bar) {
		return bar === 'bar' && foo.doBar(bar);
	}

	return doBar;
}

const doBar = bar => bar === 'bar';

export function doFoo() {
	return doBar;
}

function doFoo(foo) {
	{
		function doBar(bar) {
			return bar;
		}
	}

	return foo;
}

(function () {
	function doFoo(bar) {
		return bar;
	}
})();

useEffect(() => {
	async function getItems() {}

	getItems();
}, [])

jest.mock('module', () => {
	function createMock() {
		return 'mock';
	}

	return createMock;
});

// ✅
class UserNotFoundError extends GraphQLError {
	constructor(userId) {
		super(`User "${userId}" does not exist`, {extensions: {code: 'NOT_FOUND'}});
		this.name = 'UserNotFoundError';
	}
}

// ❌
class CustomError extends Error {
	constructor(message, options) {
		super(message, options);
		// The `this.message` assignment is useless as it's already set via the `super()` call.
		this.message = message;
		this.name = 'CustomError';
	}
}

// ❌
class CustomError extends Error {
	constructor(message, options) {
		super(undefined, options);
		// Pass the error message to `super()` instead of setting `this.message`.
		this.message = message;
		this.name = 'CustomError';
	}
}

// ❌
class CustomError extends Error {
	constructor(message, options) {
		super(message, options);
		// No `name` property set. The name property is needed so the
		// error shows up as `[CustomError: foo]` and not `[Error: foo]`.
	}
}

// ❌
class CustomError extends Error {
	constructor(message, options) {
		super(message, options);
		// Use a string literal to set the `name` property as it will not change after minifying.
		this.name = this.constructor.name;
	}
}

// ❌
class CustomError extends Error {
	constructor(message, options) {
		super(message, options);
		// The `name` property should be set to the class name.
		this.name = 'MyError';
	}
}

// ✅
class CustomError extends Error {
	constructor(message, options) {
		super(message, options);
		this.name = 'CustomError';
	}
}

// ❌
// The class name should be capitalized and end with `Error`.
class foo extends Error {
	constructor(message, options) {
		super(message, options);
		this.name = 'foo';
	}
}

// ✅
class FooError extends Error {
	constructor(message, options) {
		super(message, options);
		this.name = 'FooError';
	}
}

// ❌
class CustomError extends Error {
	constructor(message, details) {
		super(message);
		this.details = details;
		this.name = 'CustomError';
	}
}

// ✅
class CustomError extends Error {
	constructor(message, options) {
		super(message, options);
		this.details = options?.details;
		this.name = 'CustomError';
	}
}

// ✅
class CustomError extends Error {
	constructor() {
		super('My custom error');
		this.name = 'CustomError';
	}
}

// ✅
// The message is hard-coded and the error options are passed to `super()` inline, so no `options` parameter is needed.
class CustomError extends Error {
	constructor(cause) {
		super('My custom error', {cause});
		this.name = 'CustomError';
	}
}

// ✅
class CustomError extends TypeError {
	constructor() {
		super();
		this.name = 'CustomError';
	}
}

// ✅
class CustomError extends Error {
	name = 'CustomError';
}

// ❌
class CustomError extends Error {
	constructor(message, options) {
		super(message, options);
		this.name = 'CustomError';
	}

	get message() {
		return 'Custom message';
	}
}

// ✅
class CustomError extends Error {
	#message;

	constructor(message, options) {
		super(undefined, options);
		this.#message = message;
		this.name = 'CustomError';
	}

	get message() {
		return this.#message;
	}
}