TypeScriptのリンター（TSLint）の設置

TSLintとは？

単純に言うと、TSLintはTypeScriptに向けているESLintのようなリントツール（つまり、リンター）だ。

リンターとルールのインストール

オススメのルールはAirbnbのJavaScriptに向けているESLintルールのTypeScript版だ。
npm install tslint@^5.6.0 --save-dev
npm install tslint-config-airbnb@^5.2.0 --save-dev
npm install tsutils@^2.8.0 --save-dev

tslint-config-airbnbの依存のpeer dependencyのためにtsutilsのインストールもインストールしたほうがいい（インストールしないと不具合が発生する可能性ある）。

React開発の場合、tslint-reactに参考。

リンターとルールの設定

プロジェクトのルートに下記のtslint.jsonを追加：

tslint.json

{
  "extends": ["tslint-config-airbnb"],
  "rules": {
    "max-line-length": [true, 120],
    "object-shorthand-properties-first": false,
    "radix": false,
    "ter-arrow-parens": false
  }
}

下記のようなクラスのdefault importをしたい場合"import-name": falseが必要。

import TextareaAutosize from 'react-textarea-autosize';

キャメルケースの関数名などは希望なら"variable-name": falseが必要。例えば、ReactでよくStatelessComponentという関数をクラスのように利用する：

export const Routes: React.StatelessComponent<{}> = () => (...);

リントスクリプト

package.jsonのscriptsに下記のようなスクリプトを追加：

"lint": "tslint 'src/**/*.ts'"

Reactなどで使うtsxファイルもlintしたいなら：

"lint": "tslint 'src/**/*.ts{,x}'"

上記のスクリプトはnpm run lint及びyarn lintで実行できる。

注意：tslintのパラメータの周りに ' ' <=が必要！

"scripts"のサンプル：

package.json

"scripts": {
  "build": "npm run clean && npm run lint && tsc",
  "clean": "del-cli lib/* !.gitignore",
  "lint": "tslint --format stylish 'src/**/*.ts{,x}'",
  "start": "cross-env NODE_ENV=production node .",
  "start:dev": "cross-env NODE_ENV=development nodemon -e ts -w src -x ts-node src/app.ts",
  "test": "cross-env NODE_ENV=test mocha --recursive test"
}

備考：
- del-cli: rmはWindowsとかのプラットフォームを対応しないからdel-cliでクロスプラットフォーム対応のrmができる
- cross-env：環境編集の渡すことも環境によって異なるのでcross-envでクロスプラットフォーム対応の環境変数の渡すことができる

ルールについて

tslint-config-airbnbのルールは４つのルールセットに基づく：
- tslint
- tslint-eslint-rules
- tslint-microsoft-contrib
- vrsource-tslint-rules