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

CSVをちょっと編集したいときに、Visual Studio Codeなどのテキストエディタで開くとカンマ区切りのテキストとして表示されてしまいます。
かといってExcelで開くと文字化けするときがあったり、予期しない現象に当たって時間を取られてしまうときがあります。
今回紹介するVisual Studio Code拡張機能の「Edit csv」を使うと、CSVの編集がかなりラクになります。
Edit csv

Edit csvはVisual Studio CodeでCSVをプレビューして、編集作業を快適にしてくれる拡張機能です。
基本的な使い方
Visual Studio CodeでCSVを開くと、画面右上に「Edit csv」というテキストが表示されるので、このテキストをクリックします。

CSVのプレビュー画面が別タブで表示されます。
ここでCSVが表組みされた状態でプレビューされて、セルをダブルクリックして編集できます。
上の「Add row」や「Add column」で行や列を追加できます。

編集が終わったら、「Apply changes to file and save(変更をファイルに反映して保存する)」「Apply changes to file(変更をファイルに反映する)」で、CSVファイルに変更を反映します。
あくまでこのタブはプレビュー画面で、編集しただけではCSVファイルに反映されていないので、反映して保存する必要がある点だけ注意が必要です。
他にも文字揃えやヘッダーなど細かい設定もできますが、正直Visual Studio CodeでそこまでガッツリCSVを触ることは少ないと思います。
プレビューさえできればあとはラクに編集できますし、カンマが抜けていてあとで混乱することもなくなります。


Vue CLIでVue.jsの開発環境をセットアップするまでの流れ
gulpでSSI(サーバーサイドインクルード)を使用する「connect-ssi」
「DevTools z-index」でz-indexがかかっている要素をChrome開発者ツールに一覧表示させる
Vue.jsを使う人が最低限導入しておきたいVisual Studio Codeの拡張機能
Vue CLIで共通のSCSSファイルを読み込む方法
Visual Studio CodeからFTPソフトのTransmitを使用する拡張機能「Transmit」
JavaScriptで特定のOSやブラウザの判定を行う方法
MacでCLIツールをインストールするときに行うターミナルでの「パスを通す」とは一体なにか?
Vue CLIのプロジェクト管理用のGUI機能から環境を構築する
AirPodsで片耳を外しても再生が止まらないようにする方法
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
WordPressの常時SSL化で、下層ページのhttpからhttpsへのリダイレクトがうまくいかない場合に確認すること
Alfredのスニペット機能を便利に使いこなすための管理方法
Keyboard Maestroの変数基礎
コードスニペットの管理方法や命名規則について
Keyboard Maestroでウインドウのリサイズや移動をするときに使う「SCREENVISIBLE」についてのまとめ
ブラウザを開かなくても高性能な翻訳ができるDeepLのMacアプリ
AlfredでKarabiner-Elementsのプロファイルを切り替えるWorkflowの作り方
Emmetで複数のタグを一括展開して、コーディングスピードをさらに上げる方法
シンプルが特徴のノートアプリ「Simplenote」とApple純正の「メモ.app」の比較
ウインドウを画面の上にドラッグしたときに、Mission Controlが起動するのを無効化する方法