Help us understand the problem. What is going on with this article?

ESLint をグローバルにインストールせずに使う

More than 3 years have passed since last update.

はじめに

ESLint 最初の一歩では、ESLint をグローバル インストールしていました。
グローバル インストールすると eslint コマンドにパスが通って便利ですが、欠点もあります。

  • プロジェクト毎に異なるバージョンの ESLint を使えない。
    • ESLint が互換性のないバージョンアップをした時に困る (1.0.0, 2.0.0 のようなメジャーバージョンアップは互換性がありません)
  • 利用するプラグイン・共有設定もグローバル インストールしなければならない
  • チームで同じバージョンに揃えるのが手間である

npm のエコシステムでは、コマンドもプロジェクト ローカルにインストールして使うのが主流です。
そうすることで、package.jsonに依存バージョンとともに記述して共有することができます。
npm install 一発で、チームが同じ環境を揃えられるわけですね。

この記事では、プロジェクト ローカルに ESLint をインストールして使う方法を紹介します。

--save-dev

package.json は作成済みであることを想定します。
作っていない場合は、npm init 等のコマンドで作ってしまいましょう。

shell
> npm install --save-dev eslint

--save-dev オプションを使うことで、インストールされたパッケージは package.jsondevDependencies 一覧にも追加されます。
npm install コマンドは package.json の内容を見て同様のパッケージをインストールしますので、package.json を git に登録するだけで、チームでツール類のバージョンを揃えることができます。便利です。
プラグインや共有設定を使う場合も --save-dev 付きでインストールしましょう。

ただ、--save-dev でインストールすると不便な点が1つだけあります。

shell
> ./node_modules/.bin/eslint src

実行ファイルにパスが通らないので、実行するのが面倒です。

そこで...

npm-scripts

npm にはタスクランナーとしての機能があります。
package.jsonscripts フィールドにコマンドを書くと、パスが通っていない npm パッケージも素直に使うことができます。

package.json
{
    "scripts": {
        "lint": "eslint src"
    },
    "devDependencies": {
        "eslint": "^2.8.0"
    }
}
shell
> npm run lint

eslint-cli

エディタによってはグローバル インストールされた eslint しか使ってくれない不届き者もいます。また、npm run lint を定義したとしても、やっぱり eslint コマンドを使えると便利です。

そんなときに eslint-cli を使うことができます。
eslint-cli をグローバル インストールしておくと、--save-devでインストールした ESLint を実行する eslint コマンド が使えるようになります。

shell
> npm install -g eslint-cli
> npm install --save-dev eslint
shell
> eslint src

ローカルの ESLint を探して実行します (無かったらエラーです)。

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした