Kilimanjaro Warehouse

WEBとかゲーム開発のことについて書きます。

VS Code: マークダウン記法で書かれたファイルをプレビューしながら編集する

VS Code (Visual Studio Code - Code Editing. Redefined) は、
マークダウン記法で書かれたファイルのパース結果を、
リアルタイムで確認することができます。

f:id:kilimanjaro-a2:20190714120445p:plain

カラムを生の.mdファイルとプレビューの2つに分割することで、
常に見た目を確認しながらファイルを編集することができます。

f:id:kilimanjaro-a2:20190714120314p:plain
(左: 編集中のファイル, 右: パースされた結果)


以下手順です。

.mdファイルを開く

VS Codeで拡張子.mdのファイルを開きます
f:id:kilimanjaro-a2:20190714120223p:plain

.mdファイルのタブを右クリック→(上下左右)へ分割

エディタ分割機能で、好きな方向へ分割します
f:id:kilimanjaro-a2:20190714120245p:plain

.mdファイルのタブを右クリック→プレビューを開く

プレビューを表示したい場所のタブから、プレビューを開きます
f:id:kilimanjaro-a2:20190714120301p:plain

完成!

編集したファイルはすぐにプレビューに反映されます
f:id:kilimanjaro-a2:20190714120314p:plain

(記事中の.mdファイルは
A template to make good README.md · GitHub
を使用しています)