3
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

ESLint 上で dprint を使う

Last updated at Posted at 2020-06-09

dprintDenodeno fmtコマンドとして内蔵されている JavaScript/TypeScript のためのフォーマッターです。Rust で記述されており、高速に動作します。
eslint-plugin-prettier のような感じで ESLint 上で動作させられそうだったので作ってみました。

eslint-plugin-dprint

💿 インストール方法

npm かその互換ツールを利用します。

$ npm install -D eslint eslint-plugin-dprint

📖 使い方

.eslintrc.* ファイルを記述します。

.eslintrc.json (例)
{
    "extends": ["eslint:recommended", "plugin:dprint/recommended"],
    "rules": {
        "dprint/dprint": ["error", {
            "config": {
                // ここに dprint の JavaScript/TypeScript 向け設定を書く
            }
        }]
    }
}
  • dprint の JavaScript/TypeScript 向け設定は こちら
  • plugin:dprint/recommended 設定には、競合する ESLint のルールをオフにする設定が含まれています。
  • このプラグインは、dprint.config.jsファイルを読みに行きません。このプラグインは設定ファイルを解釈する CLI パッケージに依存できない1ためです。

そして、普段通りに ESLint を利用してください。

実装

dprintは、各言語向けのフォーマッターがプラグインとして独立して存在しています。dprint のコアはファイルの種別に対応するプラグインを呼び出す感じです。

eslint-plugin-dprint は、dprint の TypeScript プラグイン (typescript.wasm) を読み込んで ESLint から叩いています。その後、フォーマット前後のテキスト差分を自動修正可能な ESLint エラーとして報告しています。

lib/dprint/typescript.tstypescript.wasm を読み込んで叩いているところです。WebAssembly は文字列を直接やりとりできないので意外と面倒でした。オブジェクトを JSON 文字列でやりとりするのも非効率そうです。

  1. npm パッケージとして公開されていないこと、オープンソース ライセンスではないこと等が理由です。

3
3
0

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
  3. You can use dark theme
What you can do with signing up
3
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?