VSCodeでonSaveしたときeslintとprettierの挙動がおかしいし重すぎるし死ぬかと思った

誇張タイトル。

そしてめっちゃくだらない内容です。

VSCodeのeslintエクステンションがv2へバージョンアップしてから "editor.codeActionsOnSave" を推奨するようになったので、その設定を適用していた。

まあ詳しくはこのQiitaの記事が詳しい。

qiita.com

それで、設定から`"editor.formatOnSave"を消したつもりだったのだけど消せていなかったらしく

{
  "editor.formatOnSave": true,
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  }
}

みたいに2つとも書かれている状態になっていた。

このせいで保存するたびに自動でまずprettierがかかってからeslintがかかるのだけど、eslintのfixルールの適用がおかしいしPrettierのformatはなんかぶっ壊れた状態になるし、なんか保存に5秒くらいかかるし地獄みたいな状態だった。

{
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  }
}

従来の"editor.formatOnSave": true,を消して事なきを得た。


それにしても設定を変えたのは3月のv2になってすぐだったはずで、最近じゃないのに急に起こるようになって怪奇現象すぎる。なんなのか。

`eslint-plugin-summer`というeslintのpluginを作った

終わらないリントの夏

www.npmjs.com

というものを作って遊んでいる。

様子

https://i.gyazo.com/a66e51f8585d609a9da641fdbabce647.png

絶対に new Date() を許さない姿勢

いますぐインストール

$ yarn add -D eslint eslint-plugin-summer

.eslintrc にこういう感じのを書く

{
  "plugins": ["summer"],
  "rules": {
    "summer/no-eqeqeq-null-undefined": "error",
    "summer/no-let": "error",
    "summer/no-plain-new-date": "error"
  }
}

これでルールが使えるようになる。

recommended も用意してあるので、雑にこう書くと僕が用意したconfigがシュッと手元に入る。

{
  "extends": ["plugin:summer/recommended"]
}

よもやま話

リポジトリはここ

github.com

OSSとして公開している。

このリポジトリはlerna+yarn workspaceで構成していて、非常にミニマルなので参考にしやすい規模感かつ技術的なアピールポイントかもしれない。symlinkだけyarn workspaceにまかせて、buildとかpublishはlernaにまかせている。

がいまのところあって、pluginが上述したプラグインで、rulesのほうがルールだけを固めたライブラリ。

多くのライブラリはpluginのリポジトリでrulesを抱えていて、ルールを単体ライブラリとして公開していないケースがほとんどなのだけど、これだとruleの方をimportして使いたいというdeveloperのニーズを満たせないケースがある。なのでrulesとpluginをこのeslint-summerでは分離してmonorepoで構えて両方をnpmに公開している。

名前がなんでsummerかというとマジで意味はなくて、ネームスペース考えるのが面倒くさくて僕はhitonatsuというハンドルネームでやっているから夏だし、ちょうど季節も夏だしということでsummerになった。

たいていのルールは巷にすでにあるからエッジケースルール置き場になりそうな気はしている。とはいえそういうのを置いておく場所があることが大事で、ないと放置しがちなので積極的に機械で縛っていきたい所存。