eslint-config-react-app
now supports TypeScript as of facebook/create-react-app#6513.
This package extends eslint-config-react-app
for TypeScript files by parsing them with typescript-eslint-parser
and preventing conflicts with the TypeScript compiler. It can also be used as a less opinionated and easier to learn alternative to TSLint's recommended, React, and Prettier configs, without restrictions on type usage. Linter results for JS files are identical to eslint-config-react-app
.
The main goal is to develop a more user-friendly linter config for Create React App TypeScript (see #388), but it should work in any TypeScript React app. If you experience a conflict between an ESLint rule and your TypeScript compiler settings, please report an issue with your configs.
First, install this package, ESLint and the necessary plugins.
npm install --save-dev eslint-config-react-app-ts typescript typescript-eslint-parser eslint-config-react-app babel-eslint@^7.2.3 eslint@^4.1.1 eslint-plugin-flowtype@^2.34.1 eslint-plugin-import@^2.6.0 eslint-plugin-jsx-a11y@^5.1.1 eslint-plugin-react@^7.1.0
Then create a file named .eslintrc
with following contents in the root folder of your project:
{
"extends": "react-app-ts"
}
You also need to make sure your usage of ESLint includes TypeScript files. For example, you can run eslint . --ext js,jsx,ts,tsx
at the command line.
You can override the settings from eslint-config-react-app-ts
by editing the .eslintrc
file. Learn more about configuring ESLint on the ESLint website.