VSCodeでprotoファイルのフォーマットをする


やりたいこと

VSCodeでprotoファイルを編集する時に保存時に自動でフォーマットすること

手順

clang-format をインストール

$ brew install clang-format

プラグインをインストール

以下のプラグインをインストールします。

vscode-proto3

https://marketplace.visualstudio.com/items?itemName=zxh404.vscode-proto3

Clang-Format

https://marketplace.visualstudio.com/items?itemName=xaver.clang-format

VSCodeの設定

  • vscode-proto3 の設定
settings.json
    "protoc": {
        "editor.formatOnSave": true
    },

フォーマッタの設定

フォーマットの指定については以下のようにできます。

インデント幅をカスタマイズしたい場合

settings.json
    "clang-format.language.proto.style": "google",

インデント幅をカスタマイズしたい場合

settings.json
    "clang-format.language.proto.style": "{ IndentWidth: 4, BasedOnStyle: Google }",

または .clang-format ファイルをプロジェクトのルートディレクトリに置くとその設定が使われます。
.clang-format を1から書くのは難しいので生成したものをカスタマイズするのがよさそうです。
以下のようにコマンドを打つと生成できます。

$ clang-format -dump-config -style=Google > .clang-format

ここがちょっとハマった点でこれを書かないと保存時にフォーマットされませんでした。

settings.json
    "[proto3]": {
        "editor.defaultFormatter": "xaver.clang-format",
    }

これでフォーマットが自動でできるようになりました。