On this article, I will show you to configure eslint
with typescript
in a quick way.
I'll use yarn
on the examples below, but it can be done with npm
too.
First of all, you need to install eslint
in your project by using the following command:
$ yarn add -D eslint
Start the Configuration
To create your configuration file and set TypeScript
as enabled, you need to execute the following command in your project:
$ yarn eslint --init
After that, you will need to choose some options for the following questions:
How would you like to use ESLint?
- To check syntax only;
- To check syntax and find problems;
- To check syntax, find problems, and enforce code style;
Choose option 3
.
What type of modules does your project use?
- JavaScript modules (import/export);
- CommonJS (require/exports);
- None of these;
Choose option 1 - JavaScript modules (import/export)
.
Which framework does your project use?
- React;
- Vue.js;
- None of these;
In this case, to use NodeJS + TS, I'll choose option 3 - Node of These
.
Does your project use TypeScript?
(y/N) - The option N is selected as a default
To accept TypeScript
in your eslint
configure, set y
.
Where does your code run?
- Browser;
- Node;
If you enable the two options you can work in both.
In this example, I chose 2 - Node
and disabled 1 - Browser
.
Note: You can use the spacebar
to enable/disable options in this section.
How would you like to define a style for your project?
- Use a popular style guide;
- Answer questions about your style;
- Inspect your JavaScript file(s);
Personally, I like to use 1. Use a popular style guide
and Standard
.
What format do you want your config file to be in?
- JavaScript;
- YAML;
- JSON;
I like to use the JavaScript
format because it's easier when you need to import external files.
Would you like to install them now with npm?
(Y/n) - The option Y is selected as a default
Just press enter to install.
Note: Because I commonly use yarn
, I wait to install the packages in this last part. After that, I delete the node_modules
and install again using yarn
to guarantee consistency.
Wrapping Up
I use this process in some projects of mine and this is the easiest way to configure and use the most updated packages to enable eslint
in projects.
Was this process helpful to you? Feel free to comment below.
Top comments (2)
I can't believe I wasn't aware of
$ yarn eslint --init
until now 🤦It's good that this tip was useful to you! ✌🏻