こんにちは。beaglesoftの真鍋です。
最近はRailsとTypeScriptでの開発が中心になってきました。TypeScriptはJavaScriptを書いていることを忘れさせてくれるのですが、そうはいってもきちんとやることをやる必要があるなと思うことがありましたので、規約をチェックするために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に追加しました。
実行する
設定ファイルの作成が完了したら実際に実行してみます。何も引っかからなければ特に何も表示されません。
$ 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"が設定されていない場合にはエラーが表示されます。
RubyMineでの設定
今回はIDEとしてRubyMineを利用しているので、その設定もあわせて確認します。
メニューの File -> Settings から Settingsを表示して、Languages & Frameworks > TypeScript > TSLint を表示します。
表示した画面のEnableチェックボックスにチェックし、TSLint package のドロップダウンをクリックして表示される内容を選択します。また、Configuration fileでは Search fo tslint.json を選択します。
これで対象のファイルを開くとこの通りエラーが表示されます。
あとは、CIの中でチェックをするなどすれば良いのではと思います。その辺はもう少し後で試そうと思います。
