読者です 読者をやめる 読者になる 読者になる

cloverrose's blog

Python, Machine learning, Emacs, CI/CD, Webアプリなど

EmacsでGithub flavorなMarkdownをプレビューできるようにする

Emacs Markdown

markdown-modeを設定すると、C-c C-c pでMarkdownで書かれたファイルをHTMLに変換して、ブラウザで表示してくれるのでとっても便利です。

しかし、オリジナルのMarkdown.plを使うと表を変換できない、CSSを設定しないとすごくそっけないHTMLが表示されるという不便があります。

そこで、自分が好きな変換ツール(今回はPythonのgrip)を使うように設定しました。

手順

1. Markdown-modeをインストール

2. Gripをインストール

pip install grip

参考: GitHub Flavored Markdownを変換できるgripが便利だった - cloverrose's blog

3. PATHの通ったところに以下をmarkdownというファイル名で保存

#!/bin/sh
filename=$1
~/.virtualenvs/default/bin/grip --export ${filename} > /dev/null
cat ${filename%.*}.html

説明

  • gripにレンダリングサーバを建てるのではなく、HTMLを出力するように--exportオプションを指定
  • 実行時のExporting to hoge.htmlという標準出力が邪魔なので/dev/nullに
  • markdown-modeに変換結果を渡すためにcat

4. init.elに以下の設定ファイルを追加

;; markdown mode
;; markdownモード(gfm-mode Github flavor markdown mode)を拡張子と関連付けする
(autoload 'markdown-mode "markdown-mode"
   "Major mode for editing Markdown files" t)
(add-to-list 'auto-mode-alist '("\\.text\\'" . gfm-mode))
(add-to-list 'auto-mode-alist '("\\.markdown\\'" . gfm-mode))
(add-to-list 'auto-mode-alist '("\\.md\\'" . gfm-mode))

;; ファイル内容を標準入力で渡すのではなく、ファイル名を引数として渡すように設定
(defun markdown-custom ()
  "markdown-mode-hook"
  (setq markdown-command-needs-filename t)
  )
(add-hook 'markdown-mode-hook '(lambda() (markdown-custom)))

最後に

今までMarkdownをEmacsで書いてるけど、プレビューはできていなかったので、かなり改善しました。 今回はPythonのGripを例にしましたが、markdownというShellスクリプトでラップしてあげればどんな変換ツールでも動きます。 (markdownというコマンド名もmarkdown-commandをカスタマイズすれば好きなのにできます)

補足

本来、Gripも標準入力・標準出力をサポートしているのでmarkdown-commandを"grip --export -"に設定すれば、/usr/local/bin/markdownでラップしてあげなくてもよいはず。

しかし、日本語で書かれたREADME.mdに対して、以下のコマンドを実行すると、文字コード周りのエラー出てしまう。

cat README.md | grip --export - | less

なので、ラップしてファイル名を受け取ってHTMLを出力するのが今のところ安定している。