Linting TypeScript with Tslint

"TSLint will be deprecated some time in 2019"
We strongly advice using Typescript-Eslint instead.

Tslint is a tool that checks your JavaScript code for errors and code formatting issues. We encourage all projects to adopt the tslint:recommended configuration, along with the tslint-config-prettier to delegate checking of stylistic rules to Prettier.

Installing tslint

Before doing this, please ensure that you already have typescript installed in your projects. To add tslint, add the tslint packages to your project.

yarn add --dev \
  tslint \
  typescript-tslint-plugin \
  tslint-config-prettier \
  tslint-react

Configuring tslint

Here's our recommended tslint.json.

{
  "defaultSeverity": "error",
  "extends": ["tslint:recommended", "tslint-config-prettier"],
  "jsRules": {},
  "rules": {
    "interface-name": false,
    "object-literal-sort-keys": false,
    "member-access": [true, "no-public"]
  },
  "rulesDirectory": []
}

Configuring TypeScript

Improve your editor experience by adding typescript-tslint-plugin to your project. This makes lint warnings appear instantly in editors that support the TypeScript Server (eg, VSCode and Vim). Add this to your tsconfig.json:

{
  "compilerOptions": {
    "plugins": [
      { "name": "typescript-tslint-plugin" }
    ]
  }
}

Add scripts

Edit package.json to add a yarn lint script.

{
  "scripts": {
    "lint": "tslint -p tsconfig.json"
  }
}