18
14

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

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

Last updated at Posted at 2016-10-29

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保存する。
18
14
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
18
14

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?