Sublime Text でMarkdownのプレビュー方法(HTML編)


Sublime TextでMarkdown形式のファイルのプレビュー方法(HTML編)

  • Markdown形式が好きでよく使うのですが、作成した文章をチーム内や組織内に提出する際にHTMLに変換することがあります。
  • また、自分用のメモであってもmd(テキスト)よりもHTML化しておいたほうが可読性があがることがあります。
  • そのために利用しているプラグインの紹介

環境

  • Windows 10 (64bit)
  • 下記はインストール済みであること。
    • Sublime Text 3
    • package control

Sublime Text 2/3 Markdown Preview

インストール方法

  • インストールするプラグイン
  1. Ctrl + Shift + p を押下し、Package Control: Install Package を選択します。
  2. Markdown Preview を選択して、インストールします。

使い方

  • Ctrl + Shift + p を押下し、Markdownを入力すると下記の3つが表示される。
    • Markdown Preview: Preview in Browser
      • 作成しているMarkdownファイルをHTML変換し、ブラウザに表示する。
    • Markdown Preview: Save to HTML
      • HTML変換してファイルを保存する
    • Markdown Preview: Copy to Clipboard
      • HTML変換したデータが、クリップボードに保存される。
  • 上記の3つの中からいずれかを選択すると、下記の選択肢が出てくるので好きな方を選択する。
    二つの違いはCSSの違いとなる。
    • gitHub
    • markdown

個人的な使い方

  • Markdown記法になれてくると、都度都度プレビューをしながら文書を作成する必要が薄れてくる。
  • 一通り書いたあとで、Markdown Preview: Preview in Browser を利用してブラウザで文書の確認。
    • そして、誤字脱字があるので修正
  • 確認が終わったら、Markdown Preview: Save to HTML を利用してHTML保存する。