eslint-config-typescript-airbnb

eslint-config-typescript-airbnb

This package provides Airbnb's JS .eslintrc as an extensible shared config.

Usage

• Install correct version of each package, which are listed by the command:

npm info "eslint-config-typescript-airbnb@latest" peerDependencies

if you using npm 5+, use this shortcut

npx install-peerdeps --dev eslint-config-typescript-airbnb

This will work with yarn, npx will detect that you are using yarn and install dependencies via yarn.

• Add "extends": "typescript-airbnb" to your .eslintrc.

• For non React applications use "extends": "typescript-airbnb/base"

Linting your project

Edit package.json file and following scripts

yarn

  "lint": "eslint --ext .ts,.tsx 'src/**/*.ts?'"
  "lint:fix": "yarn lint --fix",

npm

  "lint": "eslint --ext .ts,.tsx 'src/**/*.ts?'"
  "lint:fix": "npm run lint -- --fix",

Editor setup

Webstorm

• Disable tslint
• Enable eslint
• Under help > find actions
• Add ts,tsx to eslint.additional.file.extensions

Eslint for typescript[BUG]

Webstorm cannot have eslint fix on save

VS Code

You should uninstall tslint and Prettier from extensions.

• Install eslint extension
• Under File > Preferences > Settings
• Open Edit in settings.json
• Add following lines

"eslint.validate": [
  "javascript",
  "javascriptreact",
  {
    "language": "typescript",
    "autoFix": true
  },
  {
    "language": "typescriptreact",
    "autoFix": true
  }
]

• Optionally you can enable/disable Eslint: Auto Fix On Save
  • This will enable more code style functionality than basic prettier

Credits

This config was inspired by eslint-config-react-app and eslint-config-airbnb.