はじめに
- 最近、ちょっとしたメモとかを書くときの能率を上げるために、Markdown を使用しています。今までは、txt や docx を使用していましたが、色々な難点が出てきたので、今までは Markdown です。Markdown 記法を覚えることにより、ドキュメント構成の均質化ができるようになりました。
- Markdown の利点として、
- Markdown File(.md) を Git でバージョン管理することができる。docx でも Git を利用できますが diff(ファイル差分)が難しいです。Office の標準機能では、Git に連携していないし。WinMerge を使用すればできないこともないですが、エディタ(アプリケーション)で直接見れないので、やりにくい。バージョン管理のトラッキングぐらいにしか使えません。
- Markdown は使いまわしが楽。例えば、Wordpress などのブログサイトでも使います事が可能です(ただし、方言があるので一部変える必要があることがある)
環境
- エディタとしては、マイクロソフトの Visual Studio Code(VSC) を使用します。
- https://code.visualstudio.com/download
- Windows, Mac, Linux と多様なプラットフォームで実行できるエディタです。更新が多いのが気になりますが、使いやすいです。嫌なら、Atom とか使えばいいと思います。
- この記事は、Windows 10 環境で行います。Mac と Linux はパスとか変えてください。
ゴール(目標)
- Markdown(.md) を pdf に変換できるようにしましょう。pdf なら報告書、レポートでも優秀だし。後述しますが、Markdown PDF の初期設定では、フォントなどが弱いため、CSS を組み込みます。
最初に
- VSC をインストールします。
VSC で最初にやること
- Markdown PDF をインストールする
- https://marketplace.visualstudio.com/items?itemName=yzane.markdown-pdf
- VSC のマーケットから検索してインストールしましょう!
- 本文は游ゴシック体(Windows 10 デフォルトフォント)でいきます。メイリオやヒラギノに帰る場合は、適時、変更してください。
- Windows 7 の場合、デフォルトではありません。以下の URL よりダウンロードしてください(Windows 8.1/10 はデフォルトでインストール済みです)
- https://www.microsoft.com/ja-jp/download/details.aspx?id=49116
- ソースコードは、RictyDiminished を使用します。
- https://github.com/edihbrandon/RictyDiminished
- これも好みですので、適時、変更してください
VSC の設定(setting.json)
- VSC のユーザ設定(setting.json)を変更(追記します)
#VSC の基本的な部分です(フォントサイズと VSC で表示するフォントを指定します。
"editor.fontSize" : 14,
"editor.fontFamily": ["Ricty Diminished"],
- Markdown PDF の設定
- VSC のユーザ設定(setting.json)を変更(追記します)
//Markdown to pdf の設定用です
//Markdown to Pdf のフォントはCSS で呼ばないと、pdf に反映できない。
"markdown-pdf.convertOnSave": false,
"markdown-pdf.styles": [
"C:\\Users\\(User accountの名前)\\.vscode\\markdown.css"
],
//Markdown to Pdf の印刷レイアウトです。
"markdown-pdf.format": "A4",
// ページオプション。 portrait(縦向き)、landscape(横向き)
"markdown-pdf.orientation": "portrait",
// ページオプション。 上ボーダー. 単位: mm, cm, in, px
"markdown-pdf.border.top": "1.5cm",
// ページオプション。下ボーター. 単位: mm, cm, in, px
"markdown-pdf.border.bottom": "1cm",
// ページオプション。 右ボーダー. 単位: mm, cm, in, px
"markdown-pdf.border.right": "1cm",
// ページオプション。 左ボーダー. 単位: mm, cm, in, px
"markdown-pdf.border.left": "1cm",
// ヘッダー コンテンツ
"markdown-pdf.header.contents": "",
- フォントの指定ができない。また、小節立てを(1., 1.1., 1.1.1.,)とさせたいので CSS を用意します。CSS の保存先は、先述した <"C:\\Users\\(User accountの名前)\\.vscode\\markdown.css"> に保存します。
body{
font-family: "游ゴシック";
font-size: 10.5pt;
counter-reset: chapter;
}
code, code span{
font-family: "Ricty Diminished";
}
h1 {
counter-reset: sub-chapter;
}
h2 {
counter-reset: section;
}
h1::before {
counter-increment: chapter;
content: counter(chapter) ". ";
}
h2::before {
counter-increment: sub-chapter;
content: counter(chapter) "." counter(sub-chapter) ". ";
}
h3::before {
counter-increment: section;
content: counter(chapter) "." counter(sub-chapter) "." counter(section) ". ";
}
- Markdown プレビューの設定。
- このままだと、ドキュメントを作るたびに pdf を作成するため、能率的ではありません。VSC のプレビュー機能を使用します。
- Markdown PDF と同じ CSS を読めるように settings.json を追記します。
- これを適用することで、デフォルトのプレビューのフォントから開放されます!
"markdown.styles": [
"C:\\Users\\(User accountの名前)\\.vscode\\markdown.css"
],
まとめ
-
Windows での Markdown 環境の設定手順を記述しました。ソースコードは Markdown になり、ドキュメントは pdf になります。ソースコードの管理は、Git を使用しましょう!バージョン管理が楽です。
-
Pandoc を使用するという方法があるようですが、VSC + Markdown PDF なら pdf の変換もエディタ上でできます。Pandoc で使用していた CSS も使いまわせる?はず
- Pandoc でできて VSC でできることで、図表番号の参照があります・・・
-
私はナレッジ管理を、pukiwiki で行っていますが、(Markdown → pukiwiki に変換)という Ruby スクリプトで行っています。
-
学生は Latex の代わり、エンジニアはエクセル方眼紙、docx の代わりにと使用できかと思います。。
-
Markdown 記法の書き方は、チートシートを作っている人がいます。
参考
- CSS の部分は、http://qiita.com/itagakishintaro/items/437418f917cc31de10cd を参考にしています。少し変えています。