search
LoginSignup
41
Help us understand the problem. What are the problem?

More than 5 years have passed since last update.

posted at

ESLintの設定をscoped packageでnpmにあげて使い回す

ESLintがv2にアップデートしてからけっこう変わって、だましだましv1系の設定をいじりながら使い続きてたけどだいぶカオスになってきたので気合入れて書き直した。

せっかく気合入れて書いたのでプロジェクトを横断して設定を共有できるようにしたい。

ESLintの設定を使い回すのはいくつか方法が考えられる。

  1. プロジェクトごとにコピペする
  2. npmモジュールにしてextendする

さらにnpmモジュールとして利用するのはいくつか方法があって、

  1. eslint-config-hokacchaみたいにグローバルな名前でnpmにpublishして使う
  2. scoped packageとして@hokaccha/eslint-configみたいな名前でnpmにpublishして使う
  3. githubに置いといてnpm install hokaccha/eslint-configみたいにして使う

たぶん1が一番メジャーな方法で、eslint-config-airbnbとかeslint-config-standardあたりが有名どころ。そうすると.eslintrcでは

.eslintrc
{
  "extends": "airbnb"
}

みたいにするだけでその設定を使いまわせる。

なのでeslint-config-hokacchaみたいな名前でpublishしてもいいんだけど、グローバルなネームスペースに個人の設定あげるのも何か気が引ける(個人の名前でpublishしてる人もけっこういるしそんなに問題にはならないと思うけど気持ちの問題)。

そこでscoped packageでpublishすることにした1。scoped packageについてはazuさんの記事を参照のこと。

npmで名前空間を持ったモジュールを公開する方法(scoped modules) | Web Scratch

こんな感じでnpmにpublishした。

インストールして

$ npm install --save-dev eslint @hokaccha/eslint-config

extendするだけ。

.eslintrc
{
  "extends": ["@hokaccha/eslint-config"]
}

これで気合入れて書いた設定を共有できるしアップデートにも追従できる。便利。


  1. 知らなかったんだけどteppeisさんに教えてもらった 

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
41
Help us understand the problem. What are the problem?