WAKU-TAKE-A BLOG
メニューを開く
ブログ
GitHub
ツイッター
プログラム
プロフィール
Home
Visual Studio Code
Markdown Markdown PDF PDF Visual Studio Code
Markdown PDFのすすめ
Markdown PDF
は、yzaneさんの作成したVisual Studio Code(以下VSCode)用の拡張機能で、Markdown記法で書かれた文書をPDFに出力します。
![Markdown_PDF_001.jpg](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg644FNZOc4v8-R0o9zTqnXTCEBesy-RC2hmml45CJEWbwVF9ircw4KSRNqhLM6Efn7bpacgXEKcfTc-SRm1VadDna4ILwhJGBZaNDbtWDumD-CuzqvU7e0RpvkbI7LrKXqjOLDnQgkcyg/s640/Markdown_PDF_001.jpg) [こちら](https://github.com/yzane/vscode-markdown-pdf/blob/master/README.ja.md)に日本語の説明があります。 インストール方法については、リンク先の「インストール」を読んでください。 Markdown記法の文書をPDFにして紙で出力することができるのは、何かと便利です。 あと、ver1.0.0以降においてPDF変換が、`node-html-pdf`から`puppeteer`に変更されたようなので注意が必要です。私がそうでしたが、いきなり出力されたPDFの見た目が変わり驚きました。 その後もいろいろと変更されているようです。なかなかついていけないので、デフォルトで使うようにしています。複雑な文書はAsciiDocを利用することが増えました。[こちら](https://waku-take-a.github.io/AsciiDoc.html)に記事を書いています。 ## Markdown記法とプレビュー Googleなどの検索サイトで、「Markdown 記法」と入力すれば多数ヒットします。 Markdown記法は、Github拡張・Qiita拡張などの方言がありますので、汎用的な文書にしたい場合には基本的な記述のみで書くのが良いかもしれません。 表示確認は、`VSCode`右上の「プレビューを横に表示」ボタンを押してください。 ![Markdown_Preview_001.jpg](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtJSoKS9_z9hwyn7fzL0PqD0ZWBZI2HfIePABRwiEiJrqDOd35lUwDlC0ylARZurmLaUT_vWsiooarZ_rIjNCNALwQ5baRFLQFd_g67QxlyrnDAQYFC9rc1AjV-rKv0fqrKEv18j0yxA8/s640/Markdown_Preview_001.jpg) 以下のように表示されます。 ![Markdown_Preview_002.jpg](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2ctI63HOC8AgjVQPv0hflOAWemUTydX8MtjtAMkD6IBzu8xBx-RVl1tG4FfK6FIxj8SedvwEFTkGMzC_VQDAu5d0pevpJoLfl6ihFVuGvD_VobSKEP5cjr31PjqBTngMREhMOHAl3848/s640/Markdown_Preview_002.jpg) ## 改ページの方法 PDF出力する際に特定の場所で改ページしたいことは良くあります。 改行したい箇所に、以下を貼り付けてください。 ```
``` 上の例は、スタイルシートの`page-break-before`プロバティを使っていますが、`page-break-after`プロバティを使うこともできます。 「表紙」の後ろに入れてみます。正常動作すれば、以下のように改ページされます。 入れない場合、 ![Markdown_Preview_011.jpg](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiq8fEznoc7bPgaV8RfD1WhrhsQbsD-brJsH6wQAdYOhp-XRzCNIHCd6IyTS3s9jd9MYHWTc2uiJH6GDRjZS34QT_QSiMlCY46BHHkxEtl7dcPoHAV5YPhXaSnta_VxjewNozDqCimzmVY/s640/Markdown_Preview_011.jpg) 入れた場合、 ![Markdown_Preview_012.jpg](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRjNfblnafXZ2gAIL1D_B2jxY-lxd4PT7opGZb3pInzhz9d5-KOEyVFkSH-CuT4v8TUmnVxXZjepmLHGkIgO71N-lER38VlTDE0izcYUpjIBal289-X_lW_yEGMJgzWuOxoyi8vxuIbFc/s640/Markdown_Preview_012.jpg) ちなみに、ver1.05あたりから以下でも改ページされるようになったようです。 ```
``` ## ヘッダーやフッターの編集 まず、編集する`*.md`はフォルダに入れ、`VSCode`のフォルダを開くから開いてください。 `VSCode`のファイル⇒基本設定⇒設定。 ![Markdown_PDF_002.jpg](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_TKWps29Xqs22PdJyx5oEfQwK52NkTEATwBTdTH5rTsxXigG8D6nHThcn2g1wvqbnqfZtZFv6TsUB4z6ivypujeUskn6VIfReKn85N7Ymzz4D8FbIuhHQ4dpeGIgjAqTX-frqh3Totpc/s640/Markdown_PDF_002.jpg) ワークスペースを選択し、設定の変更、もしくは、「`settings.json`で編集」でワークスペースに作成されます。 この`settings.json`で、フォルダ毎に`VSCode`のカスタマイズが可能になります。これは、他の言語の編集(たとえば`Python`)でも有効な編集方法になります。 設定の検索に、markdown-pdfと記入すれば所望の設定が表示されます。 ヘッダーやフッターの設定を行う場合の例を下にあげます。 ``` // 既定の設定とユーザー設定を上書きするには、このファイル内に設定を挿入します { // ヘッダーとフッタ-の表示 "markdown-pdf.displayHeaderFooter": true, // ヘッダー コンテンツ "markdown-pdf.headerTemplate": "
", // フッター コンテンツ "markdown-pdf.footerTemplate": "
/
" } ``` サンプルを[こちら](https://github.com/WAKU-TAKE-A/ExampleOfMarkdownPDF)に置いておきます。`VSCode`のファイル ⇒ フォルダを開くで開いてください。 ## ひとこと 簡易な文書なら、Markdownで書いてPDF出力すればWordなんか使う必要はない、と思ってしまいます。
この記事をシェアする
Twitter
Facebook
Google+
B!
はてブ
Pocket
0 件のコメント :
コメントを投稿
Previous
Next
自己紹介
WAKU-TAKE-A
詳細プロフィールを表示
人気記事
サクラエディターでGrep置換
Visual Studioのソリューションファイルのダウングレード
Zenfone2 Laser ZE500KLをRoot化してみます
Markdown PDFのすすめ
Markdown TOCのすすめ
Python3でBasic認証
Python3でDigest認証
IronPythonのスクリプトをVisual Studio Codeで実行する方法(旧)
LivetのVisual Studio 2017用プロジェクトテンプレートなどについて
IronPythonからOpenCVを利用する
カテゴリー
blogger
( 5 )
Bsic認証
( 1 )
Digest認証
( 1 )
dll化
( 1 )
Git
( 3 )
GitBucket
( 3 )
Google Form
( 1 )
IronPython
( 14 )
Ldap
( 3 )
Livet
( 2 )
Markdown
( 4 )
Markdown PDF
( 1 )
Markdown TOC
( 1 )
MVVM
( 4 )
OpenCV
( 5 )
OpenCvSharp
( 4 )
OpenLdap
( 3 )
PDF
( 1 )
pip
( 1 )
Pyhon
( 3 )
R.NET
( 1 )
ROOT
( 1 )
R言語
( 1 )
TWRP
( 1 )
Vaster2
( 2 )
Visual Studio
( 1 )
Visual Studio Code
( 4 )
Windows
( 5 )
WPF
( 3 )
XAML
( 3 )
ZE500KL
( 1 )
Zenfone2 laser
( 1 )
ZXing
( 1 )
ZXing. Net
( 1 )
サクラエディタ
( 1 )
ショッピング
( 2 )
データバインディング
( 3 )
テンプレート
( 3 )
リモートデスクトップ接続
( 5 )
在宅勤務
( 5 )
注意点
( 1 )
統計解析R
( 1 )
特別定額給付金
( 1 )
ブログアーカイブ
10月 2023
( 2 )
5月 2020
( 3 )
4月 2020
( 4 )
7月 2019
( 1 )
5月 2019
( 5 )
2月 2019
( 1 )
12月 2018
( 2 )
11月 2018
( 4 )
10月 2018
( 3 )
8月 2018
( 5 )
7月 2018
( 3 )
6月 2018
( 7 )
2月 2018
( 2 )
10月 2016
( 1 )
0 件のコメント :
コメントを投稿