目次
JavaScriptの問題点
JavaScriptは古くて新しいプログラム言語ですが、もとはホームページにちょっとした動きを与える「おまけ」的な位置付けでした。
そのためか、C言語やJAVAなどといった機械制御や業務システム向けの言語に比べると文法的な制約が緩く、自由な書き方が許されるため、人によって書き方が異なるという問題がありました。
クラウドやモバイルの後押しもあって、今ではフロントエンド開発のベースとなっているJavaScriptですが、いつまでも「書き方が異なる」状態では複数名での開発に支障をもたらします。
ESLint
そこで、JavaScriptの言語仕様であるECMAScriptの構文チェックツール「ESlint」を開発環境に組み込むと、ビルド時に自動で構文の間違いを表示してくれます。
たとえば、
- 行末にセミコロンをつけるかどうか？
- 関数名と()の間にスペースを入れるかどうか？
- タブとスペースどちらをインデントに使えるか？
- 値の比較は「==」ではなく「===」を使っているか？
などといった、細かなルールまでチェックしてくれます。
ESLintの導入方法
開発用のPCにnpmをインストール済みであることが前提です。
ローカルプロジェクトへの導入
カレントディレクトリをプロジェクトのディレクトリに移し、npm installコマンドでインストールします。
$ npm install eslint --save-devESLintの設定ファイルをセットアップします。
$ ./node_modules/.bin/eslint --initプロジェクトのモジュールにESLintを適用します。
$ ./node_modules/.bin/eslint yourfile.jsグローバルスコープへの導入
全てのプロジェクトからESLintを利用できるようにしたい場合は、npm installコマンドに「-g」または「-global」オプションをつけてインストールします。
$ npm install -g eslintESLintの設定ファイルをセットアップします。
$ eslint --initプロジェクトのモジュールにESLintを適用します。
$ eslint yourfile.js