# Visual Studio CodeでCSVの編集を見やすく行う拡張機能「Edit csv」

URL: https://webrandum.net/vscode-plugin-edit-csv/
公開日: 2022-08-25
更新日: 2022-08-25
カテゴリー: コーディング
タグ: Visual Studio Code, Visual Studio Codeプラグイン
出典: Webrandum（著者: サイトウ マサカズ）

CSVをちょっと編集したいときに、Visual Studio Codeなどのテキストエディタで開くとカンマ区切りのテキストとして表示されてしまいます。

かといってExcelで開くと文字化けするときがあったり、予期しない現象に当たって時間を取られてしまうときがあります。

今回紹介するVisual Studio Code拡張機能の「Edit csv」を使うと、CSVの編集がかなりラクになります。

## Edit csv

![Edit csv](https://webrandum.net/mskz/wp-content/uploads/2022/08/image_1-13.png)

[![](https://www.google.com/s2/favicons?domain=marketplace.visualstudio.com)marketplace.visualstudio.com![](//webrandum.net/mskz/wp-content/uploads/pz-linkcard/cache/00243763487dc7be60eab7254f4b6839d574ec3fead9e80bcc77a281e7622e5b.webp)Edit csv - Visual Studio Marketplacehttps://marketplace.visualstudio.com/items?itemName=janisdd.vscode-edit-csvExtension for Visual Studio Code - extension to edit csv files with a table ui](https://marketplace.visualstudio.com/items?itemName=janisdd.vscode-edit-csv)

Edit csvはVisual Studio CodeでCSVをプレビューして、編集作業を快適にしてくれる拡張機能です。

## 基本的な使い方

Visual Studio CodeでCSVを開くと、画面右上に「Edit csv」というテキストが表示されるので、このテキストをクリックします。

![CSVを開いたときの表示](https://webrandum.net/mskz/wp-content/uploads/2022/08/image_2-11.png)

CSVのプレビュー画面が別タブで表示されます。

ここでCSVが表組みされた状態でプレビューされて、セルをダブルクリックして編集できます。

上の「Add row」や「Add column」で行や列を追加できます。

![Edit csvのプレビュー表示](https://webrandum.net/mskz/wp-content/uploads/2022/08/image_3-9.png)

編集が終わったら、「Apply changes to file and save（変更をファイルに反映して保存する）」「Apply changes to file（変更をファイルに反映する）」で、CSVファイルに変更を反映します。

あくまでこのタブはプレビュー画面で、編集しただけではCSVファイルに反映されていないので、反映して保存する必要がある点だけ注意が必要です。

他にも文字揃えやヘッダーなど細かい設定もできますが、正直Visual Studio CodeでそこまでガッツリCSVを触ることは少ないと思います。

プレビューさえできればあとはラクに編集できますし、カンマが抜けていてあとで混乱することもなくなります。