Steps to add ESLint and Prettier and a format
script to a TypeScript project:
-
Install dependencies:
npm install -D eslint prettier @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint-config-prettier
-
Add this to the
scripts
block inpackage.json
:"format": "eslint --fix --ext .js,.jsx,.ts,.tsx . && prettier --write .",
-
Add the configuration files
.eslintrc.js
and.prettierrc.js
as shown above. -
(Optional but recommended) Add
.eslintignore
and.prettierignore
as shown above.
Give npm run format
a try!
If you run into issues with ESLint complaining about globals not being recognized, add an env
block to .eslintrc.js
. For NodeJS, that block should be:
env: {
node: true,
}
For the browser, that block should be:
env: {
browser: true,
}
If you have code that runs in both environments, you can use overrides to configure the appropriate env for different files.