Open3
Google Documents から Markdown へ変換
Google Documents を text/html
でエクスポートして rehype-cli
と remark-cli
を使ったらできるかなと考えてテスト。
変換の設定など
変換元のドキュメント
変換の設定
.rehyperc.mjs
import rehyepFormat from 'rehype-format';
import rehyepRemark from 'rehype-remark';
const remarkConfig = {
plugins: [
rehyepFormat,
rehyepRemark
]
}
export default remarkConfig
.remarkrc.mjs
import remarkGfm from 'remark-gfm';
const remarkConfig = {
plugins: [
remarkGfm
]
}
export default remarkConfig
実行
$ GOOGLE_APPLICATION_CREDENTIALS=./creds.json npx guratan recv --file-id 1.... --dest-mime-type text/html --pipe | npx rehype-cli --silent --tree-out | npx remark-cli --silent --tree-in
変換
(結果)
***
title: エクスポートしたときのテスト
***
FrontMatter はそのままだと \`---\` がエスケープされるので使えない。区切り線を \`---\` に変換されるように設定すると使えるかも(\`---\` の前後に空行が挿入されるのでそこを許容するパーサーなら大丈夫かな)。
HTML でエクスポート + rehype と remakr で Markdown へ変換したときにどのようになるか確認するためのファイル。
テストは以下のようにしている。
1. guratan で \`text/html\` へエクスポート
2. rehype-cli + remark-rehype で mdast へ変換
3. remakr-cli + remark-gfm で Markdown へ変換
# 見出し 1
## 見出し 2
ここは段落。
見出し、改行は段落となる。
改行を複数入力しても単純に段落が分割されるだけ。
* ボールド
* イタリック
* 下線
* 取り消し線
* 上付き文字abc
* 下付き文字abc
色の指定は?赤
上記はすべて適用されない。\<span> にスタイルが指定されている。
## 見出し 2
この下に区切り線がある。区切り線は「\`\*\*\*\`」に変換される。(\`---\`でないのは mdast から Markdown へ変換するときの設定の影響のはずなので変更はできると思われる。
***
脚注を設定してみる。これは設定されている[\[1\]](#ftnt1)。脚注はアンカーとして反映されるもよう。最終ページ(ページ区切りが挿入された後)に定義が追加されている。
## 改ページ前
ここは改ページ前。この下で意図的に改ページしてある。
***
## 改ページした後
ここは意図的に改ページした後。
改ページは「\`\*\*\*\`」に変換される(使用される文字は区切り線と同じ)。
この下にセクション区切りがある。
セクションの区切りはなにも反映されない。
## 見出し 2
リストにはネストが反映されない(スタイルで表現されている?)。
* リスト 1
* リスト 2
<!---->
* ネスト 1
* ネスト 2
<!---->
* リスト 2
## 見出し 2
表は見出し行を設定しても \<th> にはならない。なお、表に見出し行を設定するにはページ設定で「ページ分けあり」を選択する必要がある。
[]()[]()
| | | |
| ----- | ----- | ----- |
| head1 | head2 | head3 |
| 11 | 22 | 33 |
| a | b | c |
## 見出し 2
アンカーの確認など。おそらく表のところにアンカーが入る(その結果、マークダウン上は \[]\()\[]\() が挿入されている)。
なお、以下の表は途中で改ページされているが、Markdown 上では改ページは存在しないことになっている。
[]()[]()
| | | |
| ----- | ----- | ----- |
| 見出し 1 | 見出し 2 | 見出し 3 |
| aaa | bbb | ccc |
| ABC | ABC | ABC |
| 123 | 123 | 123 |
画像は?\`!\[]\()\` に変換はされるが、サイズや加工は反映されない(スタイルで指定されているため)
![日中の河川敷](https://lh4.googleusercontent.com/2zFC0yTM60R7e8qGD-0XzRxN4GpAJFAMRBbgqPlVDYrQv1Iu5llvGPvxBjcfQ__swuu6tsrJZelEt7-qIYam_wnYWeYz5tEjIPNjOP2PG-VavRvsRuJFA7w6W80TBzYXQfzST3mN)
## 見出し 2
コードとコードブロックは設定できない。
***
[\[1\]](#ftnt_ref1) 設定した説明。
それなりに変換されるが、装飾のほとんどがスタイルで設定されているのであまり反映されない。
対応するとしたら以下のような rehype プラグイン(hast ユーティリティ)の作成か。
-
<span>
のstyle
属性から対応タグへ変換 -
<table>
の最初の行を<th>
へ変換 - 画像は
rehype-image-salt
でstyle
を持ち越せるようにする(もしくは directive を使ったプラグインを作る)
そこそこいけそうだけど、リストのネストは class
からの判定になる(クラス名が動的に変わりそう)と AST の操作が面倒そう。この辺は以下でも難儀されているもよう。
また、コードブロックはアドオンを利用するか(どのようにエクスポートされるかは不明)、構文を無視してエスケープされたバッククオートを強引に変換するかといった感じか。
手軽に対応というには少し厳しいかな。
文法チェッカーが日本語対応しているような感じなので(何度かサジェストがでた)、スライドの作成や md-to-pdf での PDF 作成に使えるかなかと思っていがそんなに上手い話はなかった。