ESLint configuration for modern JavaScript that improves code quality by removing bad features and preventing anti-patterns
ESLint configuration for modern JavaScript that improves code quality by removing bad features and preventing anti-patterns
You can install ESLint using npm or Yarn:
npm install eslint --save-dev
yarn add eslint --dev
Then install this configuration:
npm install eslint-config-modern --save-dev
yarn add eslint-config-modern --dev
In your .eslintrc
file, add:
"extends": "modern"
This config uses features from ES6/ES2015 to ES2019 which are supported in the following environments:
Prettier is highly recommended to format your code. It is much more opinionated, powerful, and consistent than ESLint's formatting support. By using both, you can get better formatting from Prettier and still get advice of what features to use and potential errors in ESLint. Removing formatting from this style guide also makes it much simpler and more flexible, as you can use any settings you'd like in Prettier.
While configuration is not required, it's recommended you enable support for ES2017 trailing commas:
"trailingComma": "all"
JavaScript has many problematic and difficult to understand syntax features that have been replaced by newer features. Migrating to new features can drastically improve the readability, safety, and consistency of JavaScript.
class
instead of constructor functions with function
."use strict"
.var
with const
if you don't need to reassign the variable, and let
if you do.for (const i = 0; i < array.length; i++)
and for (const value in array)
with for (const value of array)
....args
instead of arguments
.async
/await
over .then()
to use Promises.parseInt()
a radix, it properly defaults to 10 on modern browsers.this
to a variable, use arrow functions or .bind()
to avoid shadowing.===
and !==
instead of ==
and !=
.fetch
or a third party library to make requests in browsers instead of XMLHTTPRequest
. undici
is a good alternative for Node.Some features have potentially dangerous or confusing usages and can be improved with care.
null
instead of undefined
, unless you're comparing with an existing undefined
value.case
in switch
.new
should be used to create instances.Some features are too dangerous or confusing to be worth using.
eval()
, use other techniques to make code dynamic.continue
, use conditional statements inside blocks instead.false
, 0
, ''
, {}
, and []
instead.with
, manually read properties or use destructuring instead.void
, it's better to use undefined
or break up multiple statements instead.&
and |
, they're usually confused with the &&
and ||
(and/or) operators, and bitwise operations are not very performant or useful in JavaScript.