Minimal setup for ESLint and Prettier in a TypeScript project

.eslintignore

# Add all build artifacts here
build
dist

.eslintrc.js

module.exports = {
  extends: ["eslint:recommended", "plugin:@typescript-eslint/recommended", "prettier"],
  plugins: ["@typescript-eslint"],
  parser: "@typescript-eslint/parser",
};

.prettierignore

# Add all build artifacts here
build
dist

.prettierrc.js

module.exports = {};

README.md

Steps to add ESLint and Prettier and a format script to a TypeScript project:

1. Install dependencies:

   npm install -D eslint prettier @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint-config-prettier
   

2. Add this to the scripts block in package.json:

   "format": "eslint --fix --ext .js,.jsx,.ts,.tsx . && prettier --write .",
   

3. Add the configuration files .eslintrc.js and .prettierrc.js as shown above.

4. (Optional but recommended) Add .eslintignore and .prettierignore as shown above.

Next steps

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.