📋

VSCode拡張: Table Formatter

2022/07/30に公開約2,200字

VSCode拡張のTable Formatterの紹介。

https://marketplace.visualstudio.com/items?itemName=shuworks.vscode-table-formatter

概要

Table Formatterは、Markdown形式などのテキスト内の表を整形するVSCode拡張である。例えば下記のような整形を行える(本家のサンプルから引用)。

|-            || update | commit | checkout |
|-||:-|:-:|-:|
git||pull / fetch > merge|commit / push|clone
hg ||pull > update|commit / push|clone

// =>
|  -  |     |        update        |    commit     | checkout |
| --- | --- | :------------------- | :-----------: | -------: |
| git |     | pull / fetch > merge | commit / push |    clone |
| hg  |     | pull > update        | commit / push |    clone |

同じような機能を持つVSCode拡張は多数あると思うが、Table Formatterは呼んだときに整形を実行するというシンプルな機能のみを持つことが特徴。入力しながらの自動整形やテーブル内のセル間移動サポートなどの機能は持たない。

インストール手順

VSCode上で下記の拡張機能をインストールすればよい。外部コマンドなどは不要。

https://marketplace.visualstudio.com/items?itemName=shuworks.vscode-table-formatter

使い方

編集中のテキスト内の特定の表を整形したいときは、その表の上にカーソルを移動させてから、下記のいずれかを行えばよい。

  • コマンドパレット経由で実行
    1. Ctrl+Shift+Pを押すなどしてコマンドパレットを表示
    2. Table: Format Currentを実行
    3. 整形が行われる
  • キーボード・ショートカット入力で実行
    1. Ctrl+Alt+Tを入力
    2. ステータスバーに「(Ctrl+Alt+T) が渡されました。2 番目のキーを待っています...」などと表示されるので、続けてCを入力
    3. 整形が行われる

テキスト内のすべての表を整形したいときは、コマンドパレットでTable: Format Allを実行するか、キーボード・ショートカットのCtrl+Alt+T Aを入力すればよい。

設定について

Table Formatterは、整形の行い方に関するいくつかの設定項目を持つ。

手元では、下記の設定変更を行って使っている。

  • Common: Center Aligned Header (settings.jsonなどでの変数名はtableformatter.common.centerAlignedHeader)
    • 表のヘッダを必ず中央寄せにするかどうか。デフォルトはtrue
    • 手元ではfalseに変更
  • Markdown: One Space Padding (変数名はtableformatter.markdown.oneSpacePadding)
    • ヘッダのセパレータの前後に空白を入れるかどうか。デフォルトはtrue
    • 手元ではfalseに変更

なお、設定変更は一般的なVSCodeの設定変更手順で行える。例えば下記のとおり。

  • VSCodeの設定画面を使う
    1. メニューから選ぶ、あるいはCtrl+カンマを入力するなどして設定(Settings)を開く
    2. 拡張機能(Extension)のTable Formatter Configurationを開く
    3. 表示された各項目を好みに合わせて変更する
  • settings.jsonを編集する

動作を確認した環境

項目 内容
OS, Distribution Debian bullseye (11.4) for amd64
Visual Studio Code 1.69.2
VSCodeのTable Formatter拡張 v1.2.1

Discussion

ログインするとコメントできます