pandoc のコマンドライン・オプション

希望通りにするには pandoc のコマンドライン・オプションを適切に指定する必要があります。しかし、その方法は遠いところにあります。

CodeBraid Preview 拡張機能が、CodeBraid を起動し、CodeBraid が pandoc を起動します。
CodeBraid Preview 拡張機能の設定項目にあるコマンドライン・オプションは、エクスポートするときの設定です。プレビューとエクスポートの表示を同じにするには両方のコマンドライン・オプションを変更する必要があります。
ここでは、設定項目のうち、pandoc のパスの指定を利用します。pandoc の代わりに別のコマンド（pseud_pandoc）を実行させます。そのコマンドから、任意のオプションを指定して pandoc を実行します。
この pseudo_pandoc は、CodeBraid Preview 拡張機能の設定によって、pandoc の代わりに実行されます。pseudo_pandoc は、pandoc を起動しますが、そのコマンドライン・オプションは新たなものに変えられます。

1 pseud_pandoc

CodeBraid Preview 拡張機能は、プレビューとエクスポートのために CodeBraid、pandoc を呼び出します。マークダウンを HTML に変換しているのは pandoc です。
プレビューとエクスポートは同じ表示なのが理想です。同じ css を使いますが、プレビューはマークダウンの編集中に vscode の窓に表示され、エクスポートした .html はサーバに置かれブラウザで開かれます。

1.1 プレビューとエクスポートの区別

プレビューと、エクスポートでは、pandoc のコマンドライン・オプションが異なるので、識別した上で、それぞれ新たなオプションを用意します。
この識別は、上位が指定したコマンドラインに --output があるかどうかで判定します。
プレビューのための HTML は、stdout に出力され、上位に返され、プレビューの窓に表示されます。
.html ファイルをエクスポートするときは、 --output が指定して、pandoc が直接ファイルに書き出します。

1.2 共通のコマンドライン・オプション

プレビューとエクスポートの両方に同じ設定しているオプションです。見た目が同じになることを目的にしているので、同じオプションになります。

オプション	設定値	機能
–standalone	なし	HTMLの全体を出力。pandoc はマークダウン a に対して <p>a</p> を出力します。ここでは、 <!DOCTYPE html><head></head><body><p>a</p></body></html> のように全体を出力します。
–variable	lang=“ja”	<html>タグに設定
–to	html5	出力は HTML
–number-sections	なし	章番号の付与
–highlight-style	pygments	シンタックス・ハイライトのテーマ
–mathjax	なし	数式に MathJax を使用
–lua-filter	show_raw.lua codebraid_output.lua mermaid_image.lua diagram-generator.lua	pandoc が呼び出すフィルタ。pandoc は LUA インタプリタを持っている。
–include-before-body	before.inc	body の先頭に挿入される。数式の左と上の余白を調整する MathJax用のstyleの補足。

1.3 プレビュー用のオプション

プレビューのために作られる HTML には、そのソースのマークダウンの行との対応関係が含まれます。プレビューアは、表示を同期してスクロールするために使っています。
また、vscode のテーマなどに従ってた表示色を使うために、vscode 用の css を読み込んでいます。

オプション	設定値	機能
–from	commonmark_x.lua+hard_line_breaks+sourcepos	入力フィルタと、そのオプション。プレビューとマークダウンの表示の同期のための情報を含む。
–extract-media	extract-media	CodeBraid が使うフォルダ。
–lua-filter	sourcepos_sync.lua	プレビューとマークダウンの表示の同期に使うしるしを出力。
–include-in-header	preview_head.inc	HTML のヘッダに挿入。cssファイルのリンクと MathJaxの設定。
–css	codicon.css	vscode の表示機能用の css。
–variable	codebraid_preview

1.4 エクスポート用のオプション

プレビュー用の HTML は
CodeBraid Preview 拡張機能が表示しますが、エクスポートした .html を使うことはないので、拡張機能は、そのオプションについて説明していません。
プレビューと同じ表示にしたいので、入力フィルタは同じですが、sourcepos は不要です。

オプション	設定値	機能
–from	commonmark_x.lua+hard_line_breaks-sourcepos	入力フィルタと、そのオプション。プレビューとマークダウンの表示の同期のための情報は不要。
–template	default.html	HTML の雛形。
–output	ファイル名	出力するファイルの名前。
–embed-resources	なし	href や src 属性で指定されたファイルを base64 エンコードして内包する。
–toc	なし	pandoc に Table Of Contents の生成を指定。
–toc-depth	2	生成する TOC の階層。
–resource-path	/Users/xxx/Documents/Workspace/CodeBraidPreview	マークダウンが参照している図形などのファイルのパス
–include-in-header	export_head.inc	HTML のヘッダに挿入。cssファイルのリンクと MathJaxの設定で、プレビューと同じだが内包されないようにスクリプトになっている。
–include-after-body	after.inc	TOCの補正。
–variable	s3=TRUE	?
–variable	theme=bootstrap	?

出力する .html には、テンプレートを使います。
エクスポートは pandoc がファイルを書き出すので、そのファイル名が必要です。
エクスポートした .html には pandoc でページ内の目次（TOC）を付けます。
–embed-resources を設定すると、マークダウンが参照している図などのリソースファイルが .html に内包されます。

2 パスについて

2.1 パソコンのフォルダ

何がどうなったのか分かりませんが、今は .html をサーバなしにパソコンのブラウザで、ローカルに開けるようになっています。
試してみると、css ファイルも、ローカルな絶対パスで、問題なく参照できます。

2.2 css ファイルのパス

–css で指定した css ファイルは、ブラウザが読み込む URL です。プレビューの窓でも同じです。
これに対して、–resource-path に指定するフォルダは、pandoc が使うパスです。
pandoc は Windows のアプリケーションですから、パソコン内のファイルをアクセスできます。
通常、ブラウザは、.html があるサーバから css を読み込みます。ブラウザのあるパソコンのファイルは使いません。
プレビューの窓はブラウザと同じで、パソコン内の css を読めないようです。ここでは、特別な URL を書いて読み込んでいますが、理解はできていません。

3 commonmark_x 入力フィルタ

pandoc のマークダウンの読み込みは commonmark_x.lua を使います。マークダウンの窓とプレビューの窓の表示を同期させるために必要なことがドキュメントにあるからです。
これによって、入力となるマークダウンは、ComonMark と言うことになります。マークダウンは沢山ありますが、ここでは、ComonMark の記法によることになります。

※ 私にとって不都合なことに 1つ気が付きました。神（795e）と神󠄀（fa19）を書き分けることが出来ないことです。commonmark_x 入力フィルタは、マークダウンを読み込んだ時点で神󠄀（fa19）のUnicode を 795e に書き換えてしまいます。ここでは、異体字セレクタを使用して字形を変えています。