toshi-toma blog

主にフロントエンド、作業ログあとは色々なメモ ✍️ 🍅

「What's coming in ESLint v7.0.0」を読んだ

What's coming in ESLint v7.0.0

https://eslint.org/blog/2020/02/whats-coming-in-eslint-7.0.0

What's coming in ESLint v7.0.0の画面キャプチャ

ESLintの次のメジャーバージョン「7.0.0」に入る機能が決まったようです。

社内用に日本語でのまとめを書いたので、せっかくなのでブログとしても公開します。

※ ESLintは日本人のTSC(Technical Steering Committee)の方がいて、いつもQiitaに解説記事を投稿してくれるので、もしその記事が出たらそちらを見るほうが良いです。

v7.0.0の開発は以下のGitHub Projectで確認できます。

https://github.com/eslint/eslint/projects/6

✋Dropping support for Node.js v8.x

Nodeのv8.xは去年の12月でEOLになったのでESLintもv7のタイミングでNode v8.xのサポートを終了

"engines": {
-    "node": "^8.10.0 || ^10.13.0 || >=11.10.1"
+    "node": "^10.12.0 || >=12.0.0"
}

Deprecating Node.js/CommonJS-specific rules

コアのルールが見直され、Node.js/CommonJS特有のルールはeslint-plugin-nodeに移行される。

ESLint本体で管理されている以下のルールはコアのルールとしてはdeprecatedになり、eslint-plugin-nodeに移行されます。

  • callback-return
  • global-require
  • handle-callback-err
  • no-buffer-constructor
  • no-mixed-requires
  • no-new-require
  • no-path-concat
  • no-process-env
  • no-process-exit
  • no-restricted-modules

将来のメジャーリリースでコアから削除される予定なので、eslint-plugin-nodeに移行しておいてね。という話

ESLint class replacing CLIEngine class

ESLintのAPIを非同期APIに移行。

これまでESLintをNode.jsから利用する場合、CLIEngineクラスを利用していました。(このクラスを使ってエディタのプラグインやESLint組み込みのツールなどが作られてる)

ただ、CLIEngineクラスは同期APIなので、並列でファイルをチェックやECMAScriptモジュールのロードなど新しい機能のブロッカーになっていました。

そこで新しく非同期APIであるESLintクラスへの置き換えを進めていくようです。

ESLintクラスは最初CLIEngineの単なるラッパーとして作って、段階的に非同期メソッドを実装していき、最終的に、ESLintクラスとCLIEngineクラスが完全に分離されるっぽい。(このあたりの詳しい実装はよく分からなかったので曖昧です)

v7.0.0では、CLIEngineクラスはdeprecatedになる。 将来のメジャーリリースでCLIEngineを削除する予定

Descriptions in directive comments

/ eslint-disable **/に説明がつけれる

/* eslint-disable no-new -- this class has a side-effect in the constructor. */

Warnings for using ~/.eslintrc

v6.7.0で非推奨になっているホームディレクトリでの.eslintrc(設定ファイルが見つからない時にホームディレクトリの設定が適用されるやつ)がv7.0.0だと警告されるようになる。

ホームディレクトリでの.eslintrcはv8.0.0で削除予定。

Updating the base path when using --config or --ignore-path

--configや--ignore-pathオプションで指定した設定ファイルやignoreファイルのbase pathがworking directoryになる。これまでは、オプションで渡したファイルの場所だったっぽい。

Plugins loaded from config file directory

ESLintのshared-config(eslint-config-xxx)からpluginを直接読み込めるように。

https://eslint.org/docs/developer-guide/shareable-configs

v7.0.0以前ではプラグインの読み込みはESLintがインストールされている場所(v5.x)だったり、working directory(v6.x)でした。

v7.0.0からはリント対象のファイルに最も近い設定ファイルを基準にプラグインが読み込まれるようになるっぽい。

これまでeslint-config-xxxのpackage.jsonでは依存してるpluginはpeerDependenciesに指定して利用側でpluginをインストールしていたが、dependenciesに指定することができるようになる。

File extensions in config files

v7.0.0以前では、ディレクトリを指定してリントを実行した場合、*.jsファイルだけが対象になっていた。それが設定ファイルのoverridesセクションのファイル指定にマッチするファイルがリント対象になる。

React、Vue.js、TypeScriptなど、.js 以外のファイルを利用している場合に便利です。

Updated default ignore patterns

ESLintのデフォルトのignore patternに以下の要件を追加

  • unignore .eslintrc.js
  • unignore /bower_components/*
  • ignore node_modules/* in subdirectories

Stricter RuleTester

ESLintのルールのテスト用のAPIであるRuleTesterにいくつか追加されている。

https://eslint.org/blog/2020/02/whats-coming-in-eslint-7.0.0#stricter-ruletester

  • Fails if a rule uses the nonstandard node.start or node.end properties, which may not be provided by all parsers that ESLint supports.
  • Autofix rules must test the output of their fixes.
  • Tests where the code has a syntax error will now fail.
  • Tests fail if the test specification contains unknown properties.

いくつかありますが

Autofix rules must test the output of their fixes.

Autofix時の結果をテストで書いてないplugin多いから、対応大変かも。

Installing preview releases of v7.0.0

この内容はnext tagでインストール可能です。

$ npm i eslint@next --save-dev