nomitainA ~ノミタイナ~ブログ

技術系の自分用メモ

Markdownをhtmlに出力したい

Markdown記法で作成したファイル(.md)をhtmlに変換してみた. 変換にはPandocを使用した.

はじめに

職場にあふれるExcelで作られたドキュメントたち.下記の理由でとても嫌い.
- 差分管理が実質不可能
- コピペのし辛さ
- レイアウトの崩れやすさ
- 見た目の統一のわずらわしさ
- オートコンプリートによる度重なる作業妨害
- 頑張って作ったわりに,たいして見やすい訳じゃない

百害あって一利なし」のお手本のような状況なので,これを改善したい.
個人的に気に入っているMarkdownを文化として浸透させて心穏やかに過ごしたい.

なぜhtmlか

簡単にかけて,こんなに綺麗に表示できるんだよ!ということをまずは知ってほしい.
「.mdファイルをプレビューするにはまずはこのエディタを...(ブツブツ」という説明から始めると,
煙たがられて一生普及しない.

というわけでMarkdownで編集し最終ドキュメントはhtmlとして出力することにした.
変換にはPandocというライブラリを利用した.

Pandocは様々なデータ間の変換に対応していて,htmlの他にはPDFやdocx(Word形式)にも変換可能.
docxへの変換はスタイルがうまく反映されなかった.
PDF変換には別途LaTeXのパッケージが必要.

今回はhtmlに変換.

Pandoc

インストール

公式ページから.
超簡単.Pandoc -vで正常にインストールされていることを確認.

変換

下記を実行.出力された sample.html をブラウザで開いて確認.

pandoc -f gfm -t html5 -s --self-contained -c .\css\style.css sample.md -o sample.html  

# style.css     : 指定するスタイルシート
# sample.md     : 今回の入力Markdownファイル
# sample.html   : 出力ファイル名

オプションについて詳細はPandoc ユーザーズガイド 日本語版

sample.md は GFM(Github Flavored Markdown) の記法.
そのため,入力ファイルの形式にはgfmを指定している.
qiita.com

スタイルシートは好きなものを準備.例えば下記から入手.
https://github.com/sindresorhus/github-markdown-css

おわりに

Pandocはインストールが簡単で使いやすい.

実際にhtmlに出力してみて感じたメリットは
共通のスタイルシートを指定することで複数のドキュメントの見た目が統一できること.
チーム内で共有するためのドキュメントとは相性が良い.

余談

Markdown編集用に今まではAtomを使用していたが今回 Visual Studio Code をインストールして使ってみた.
Atomは動作が重いけど,VSCodeは軽い.レンダリングもいい感じ.
メインのエディタとして移行を検討したい.

WindowsでHaskellしたい

やりたいこと

関数型言語に興味をもったのでHaskellを勉強中.
WindowsHaskellを実行したい. 下記2つを目指す.

  • stack経由でHaskellのビルドや実行ができるようにする
  • AtomでのHaskell開発を快適にする

準備

stack

  1. 公式ページ(Install/upgrade - The Haskell Tool Stack)からstackのバイナリを取得
    インストーラもあったけど, 今回はバイナリを直接叩くことにした.

  2. 取得したstack.exeを適当な場所に配置してPATHを通す

GHC

  1. stack setup

  2. ライブラリ類インストール

    stack install ghc-mod
    stack install stylish-haskell
    stack install hlint
    管理者権限で実行しないと怒られる

    C:¥Users¥{User}¥AppData¥Roaming¥local¥binへPATHを通す.

Atom パッケージ

入力補完と静的解析の恩恵が受けられるらしい.

Hello, World

* プロジェクト準備
適当なワークスペース下にsampleプロジェクトをつくる.

cd workspace
stack new sample

* ソースコード修正

sample¥app¥Main.hs

  import Lib

  main :: IO ()
  main = soumeFunc

sample¥src¥Lib.hsのsomeFuncをcallしているので, someFuncを修正.

  someFunc :: IO ()
  someFunc = putStrLn "Hello, World"

* ビルド& 実行

cd workspace¥sample
stack build
stack exec sample-exe

参考

qiita.com

qiita.com