テスト 1

本文の入力はリッチエディタに戻した。ただし、HTML は CodeDock で拡張してある。以下、そのテスト。

見出しのテスト 1

どうかな?

見出しのテスト 2

いちおう動作するもよう。

見出しのテスト 2-1

これは?

見出しのテスト 2-2

どうかな?

パラグラフのテスト

改行を複数入れてある。

ここまで。

  • 改行も除去されるかな
  • 項目 2

リストの前後に空行が入っている。

画像

画像のテスト。

ev car

引用

どうかな?

引用も普通に使えるはずだが。

使えた。

テーブル

簡単なテーブルを記述してみる。

項目 1項目 2項目 3
abcabcabc 100070
ABCABCABC 5001000
あいうえお220090

普通にテキストフィールドで markdown 記述してもそうだけど、コードブロック内でテーブルを編集するのはちょっと面倒。

コードブロック

CodeDock による言語指定あり。

function normalizeProcessor(processor: Processor): FrozenProcessor {
  return processor
    .use(rehypeMinifyWhitespace)
    .use(rehypeSanitize, (schema as unknown) as Schema)
    .use(rehypeStringify)
    .freeze();
}


export async function normalizedHtml(
  processor: Processor,
  html: string
): Promise<string> {
  return await new Promise((resolve, reject) => {
    normalizeProcessor(processor).process(html, (err, file) => {
      if (err) {
        console.error(err);
        reject(err);
      }
      resolve(String(file));
    });
  });
}

埋め込み

リッチエディタでの埋め込みは markdown への変換ところで動作しないんじゃないかなと。

というわけで、CodeDock で試してみる。いちおう動いてるもよう。

所感

とりあえずは想定していた通りに動作する。

  • テーブルは普通にいける

  • コードのシンタックスハイライトは Markdown 内部からさらにコードブロック

    • 記述が増えるが言語指定が可能になる
  • 埋め込み(iframe)が使えるのはちょっと意外だった

  • コードブロックが末尾にあると改行のみでブロック解除にならないのが面倒

  • draftlint も動作する

  • 画像の alt は忘れがちになる(draftlint でどうにかする?)

    • Marp スライドでサイズや bg 指定していたら慣れた
  • リストをネストすると<li>の中に<p> が入る(どこで入る?)

ということで、微調整しながら利用する予定。