1
1

Prettierは様々な言語に対応したフォーマッタであり,Markdownのフォーマットも可能です.しかし,日本語が含まれるMarkdownの場合,英数字の前後に不要な空白が挿入されてしまう問題が知られていました

この問題はPrettier v3.0.0から解決されていたようです

ですが,VSCodeの拡張機能に付属するPrettierはバージョンが古く (?) この問題に対応していません

別途インストールしたPrettierを使ってフォーマットする設定が必要です

prettierのインストール

ローカルかグローバルどちらでも良いのでインストールします.グローバルに入れる場合は適切にパッケージを管理しましょう

    # グローバルインストール
    npm install -g prettier

バージョン3.0.0以上がインストールされていることを確認します

    prettier -v

prettierのパスを設定する

インストールしたprettierのpackage.jsonへのパスを取得します.通常は/usr/local/lib/node_modulesを探せば見つかると思います

    # グローバルインストールされているパッケージを探す
    npm list -g --depth=0

prettierの実行ファイルではなくpackage.jsonへのパスです.which prettierで得られるパスではありません

voltaなどのツールを使用している場合,別のところにあったりします.私の場合はここにありました
/Users/user/.volta/tools/image/packages/prettier/lib/node_modules/prettier/

VSCodeの設定を変更する

得られたパスをprettier.prettierPathに指定します

settings.json
  "prettier.resolveGlobalModules": true,
  "prettier.prettierPath": "/Users/user/.volta/tools/image/packages/prettier/lib/node_modules/prettier/",

editor.formatOnSaveでMarkdownをフォーマットするように設定すれば動作確認できます

以上です

1
1
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
1
1