Blog3 の html 形式のエントリを markdown に変換する
Blog3 は歴史がありすぎて、はてなダイアリーから取り込んだデータが含まれている。 はてなダイアリーからエクスポートしたデータは HTML になっていました。 これまでは過去のデータを振り返ることはなかったので困っていなかったのだけど、Blog3 の大幅書き直しに伴い、Scrapbox みたいな UI にしたんですよね。で、結果として過去の記事を振り返る機会が増えたのです。 検索機能とかもめっちゃ使いやすくなったし、過去の記事へのリンクも貼りやすくなった。
しかし、結果的に過去の記事を振り返ろうと思うと、HTML が textarea に表示されるのはしんどいな、と。
そういうわけで過去データをついに markdown に強制変換しようかな、と。
相当に古い記事なので多少ぶっ壊れることを覚悟で一括で強制変換してしまうという手もあるんだけど、せっかくなので、マイグレーションツールみたいなのをでっち上げることにする。
/admin/htmltomd/で html 形式と markdown と、markdown を HTML にレンダリングされたフォーマットでサイドバイサイドでレンダリング。POST /admin/htmltomd/{PATH}/commitで markdown 形式を保存する
というような構成で実装しようかなぁ。
今は、ローカルからも本番に繋げる構成になってるので、手元で内容見ながら1個ずつ動かすという感じにしよう。
最初は turndown を使っていたのだが、これは一個だけ要件を満たさなかった。
<pre class="code" data-unlink="data-unlink">> our $n=3; 3 > $?PACKAGE.WHO<$n> 3</pre>
という記法が code block に変換されない。
html-to-md というライブラリだとできたので、こっちを採用。
import html2md from 'html-to-md'
const html = `
<pre class="code" data-unlink="data-unlink">> our $n=3; 3 > $?PACKAGE.WHO<$n> 3</pre>
<p>他の HTML 部分。</p>
`;
const markdown = html2md(html);
console.log(markdown);
で、以下のような確認画面を作って、ちゃんとフォーマットできてるかをざっと確認して、コンバートしていく。
結果としてはこういうコードを書いた。