tslintのインストール - blog.beaglesoft.net

こんにちは。beaglesoftの真鍋です。

最近はRailsとTypeScriptでの開発が中心になってきました。TypeScriptはJavaScriptを書いていることを忘れさせてくれるのですが、そうはいってもきちんとやることをやる必要があるなと思うことがありましたので、規約をチェックするためにTslintをインストールすることにしました。

TSLint

なお、以下の手順はあらかじめTypeScriptで開発できる環境が整っていることを前提とします。

インストール

tslintのインストールはnpmで行います。すべてのプロジェクトで利用するのでシステムグローバルにインストールします。

$ sudo npm install -g tslint typescript
[sudo] password for ymanabe: 
/usr/local/bin/tslint -> /usr/local/lib/node_modules/tslint/bin/tslint
/usr/local/bin/tsc -> /usr/local/lib/node_modules/typescript/bin/tsc
/usr/local/bin/tsserver -> /usr/local/lib/node_modules/typescript/bin/tsserver
/usr/local/lib
├─┬ tslint@3.13.0 
│ ├── colors@1.1.2 
│ ├── diff@2.2.3 
│ ├─┬ findup-sync@0.3.0 
│ │ └── glob@5.0.15 
│ ├─┬ glob@7.0.5 
│ │ ├── fs.realpath@1.0.0 
│ │ ├─┬ inflight@1.0.5 
│ │ │ └── wrappy@1.0.2 
│ │ ├── inherits@2.0.1 
│ │ ├─┬ minimatch@3.0.2 
│ │ │ └─┬ brace-expansion@1.1.6 
│ │ │   ├── balanced-match@0.4.2 
│ │ │   └── concat-map@0.0.1 
│ │ ├── once@1.3.3 
│ │ └── path-is-absolute@1.0.0 
│ ├─┬ optimist@0.6.1 
│ │ ├── minimist@0.0.10 
│ │ └── wordwrap@0.0.3 
│ ├── resolve@1.1.7 
│ └─┬ underscore.string@3.3.4 
│   ├── sprintf-js@1.0.3 
│   └── util-deprecate@1.0.2 
└── typescript@1.8.10

tslint.jsonの生成

インストールが完了したら、設定ファイルを作成します。

$ cd /path/to/project
$ tslint -i

これで /path/to/project にtslint.jsonが作成されます。今回はTypeScriptで今すぐ使える実践的『ECMAScript 2015』 | HTML5Experts.jpを参考にして"use-strict"のチェックを行いたいと思ったのでデフォルトのtslint.jsonに追加しました。

use-strictを導入したtslint.config

実行する

設定ファイルの作成が完了したら実際に実行してみます。何も引っかからなければ特に何も表示されません。

$ tslint -c ./tslint.json app/assets/javascripts/common/dhtmlxHelper.ts
app/assets/javascripts/common/dhtmlxHelper.ts[7, 1]: missing 'use strict'

lintでチェックした内容は以下の通りです。

/// <reference path="../../../../typings/index.d.ts" />

declare var dhtmlXCalendarObject: any;

export namespace common.dhtmlx {

// ↓ここをコメントアウトした
// "use strict";

    /**
     * このモジュールはDHTMLXライブラリのサポート用クラス
     */
    export class DhtmlxHelper {
...
    }
}

確かに"use strict"が設定されていない場合にはエラーが表示されます。