bm-md

bm.md Markdown レイアウトスキル

主な機能

bm.md を使用して、以下のタスクを実行できます。

• Markdown のレンダリング：Markdown をスタイル付き HTML に変換します。8 種類のレイアウトスタイル、テキストのハイライト、画像サイズに対応しています
• HTML から Markdown への変換：HTML コンテンツを Markdown 形式に逆変換します
• プレーンテキストの抽出：Markdown からすべての書式マークを取り除き、プレーンテキストを抽出します
• 書式の検証と修正：Markdown の書式上の問題を自動検出して修正します

主なワークフロー

1. 納品目標を明確にする：対象読者、出力先のプラットフォーム、事実の範囲、希望するファイルを確認します。情報が不十分な場合は、事実や数値を推測せず、先に質問します。
2. まず本文を構成する：タイトルの階層、段落、リスト、表、引用、コードを整えてから、見た目の強化を検討します。
3. 意味に応じて強化方法を選ぶ：理解の助けになる場合にのみ、Mermaid、Infographic、ハイライト、画像サイズを追加します。以下の判断ルールに従い、必要に応じて対応するリファレンスを参照します。
4. レンダリングを実行する：CLI を優先します。ローカルでコマンドを実行できない場合、またはユーザーがリモート呼び出しを明示的に希望する場合は、REST API を使用します。
5. 確認して必要なら差し戻す：コマンドの状態、レスポンスの result、図表のエラー、重要な情報がすべて含まれていることを確認します。拡張構文が失敗した場合は、まず修正します。それでも失敗する場合は、構成の明確な本文、リスト、または表に戻し、壊れた図表は納品しません。

拡張方法の選択と必要に応じたリファレンス

• フロー、呼び出しチェーン、状態、クラス関係、ER モデル： Mermaid を使用します。
• 並列、手順、比較、階層、関係、または実際の数値： AntV Infographic を使用します。フィールドはテンプレートに対応付けられているため、リファレンスにある検証済みの例に従って生成します。
• 特定箇所の重要な結論：テキストハイライトを使用します。段落全体はハイライトしないでください。
• ユーザーが指定したサイズ、またはレイアウト上、固定サイズが必要な場合：画像サイズ構文を使用します。サイズが不明な場合は、通常の画像のままにします。

控えめに使用してください。単純な内容を図表で装飾したり、同じ情報を Mermaid と Infographic の両方で表現したり、事実や数値を捏造したりしないでください。リッチな Markdown を生成したら、必ず bm.md でレンダリングして結果を確認してください。

実行の優先順位

1. CLI を優先して使用：ローカルで node --version を実行できる場合は、bmmd コマンドで Markdown を処理します。
2. CLI の実行方法：システムに bmmd がインストール済みの場合は、そのまま使用します。未インストールの場合は、npx -y bmmd で一時的に実行します。
3. REST API をフォールバックとして使用：Node.js 環境がない、ローカルコマンドを実行できない、またはユーザーがリモート呼び出しを明示的に希望する場合は、https://bm.md/api/markdown/* を使用します。

CLI はデフォルトで結果を stdout に出力します。--output <file> を指定すると、ファイルに書き込めます。REST API は JSON を返し、結果は result フィールドに含まれます。

---

利用可能なツール

1. Markdown のレンダリング

Markdown のソーステキストをインラインスタイル付き HTML にレンダリングします。リッチテキストエディターに直接コピーできます。

CLI の例（優先）：

npx -y bmmd render article.md --platform wechat --output article.html

stdin に対応しています：

cat article.md | npx -y bmmd render --platform wechat > article.html

エンドポイント：POST https://bm.md/api/markdown/render

リクエストパラメーター：

パラメーター	型	必須	デフォルト値	説明
markdown	string	はい	-	Markdown ソーステキスト。GFM 構文と数式に対応
markdownStyle	string	いいえ	kami	レイアウトスタイル ID。以下の完全な一覧を参照
codeTheme	string	いいえ	kimbie-light	コードブロックのハイライトテーマ ID。以下の完全な一覧を参照
mermaidTheme	string	いいえ	""	Mermaid 図表のテーマ ID。空文字列 ""（デフォルトのライトテーマ）または "dark"（ダークテーマ）を選択できます
infographicTheme	string	いいえ	default	Infographic のテーマ ID
infographicPalette	string	いいえ	antv	Infographic の配色 ID
customCss	string	いいえ	""	カスタム CSS。セレクターは #bm-md の下に限定してください。例：#bm-md h1 { color: red }
enableFootnoteLinks	boolean	いいえ	true	リンクを脚注形式に変換するかどうか
breaks	boolean	いいえ	false	段落内のソフト改行を HTML の改行に変換するかどうか。コードブロックには影響しません
openLinksInNewWindow	boolean	いいえ	true	リンクを新しいウィンドウで開くかどうか
platform	string	いいえ	html	対象プラットフォーム：html、wechat
footnoteLabel	string	いいえ	Footnotes	GFM 脚注セクションの見出し
referenceTitle	string	いいえ	References	外部リンク参照セクションの見出し

curl の例：

curl -X POST https://bm.md/api/markdown/render \
  -H "Content-Type: application/json" \
  -d '{
    "markdown": "# 标题\n\n这是一段**加粗**的文字。\n\n```javascript\nconsole.log(\"Hello, World!\");\n```",
    "markdownStyle": "kami",
    "codeTheme": "kimbie-light",
    "platform": "wechat"
  }' \
  -o bm.md.json

レスポンスの例：

{
  "result": "<div id=\"bm-md\"><h1 style=\"...\">标题</h1>...</div>"
}

---

2. HTML から Markdown への変換

HTML ソースコードを Markdown 形式に変換します。

CLI の例（優先）：

npx -y bmmd parse page.html --output article.md

stdin に対応しています：

cat page.html | npx -y bmmd parse > article.md

エンドポイント：POST https://bm.md/api/markdown/parse

リクエストパラメーター：

パラメーター	型	必須	説明
html	string	はい	HTML ソースコード。完全なドキュメントにも断片にも対応

curl の例：

curl -X POST https://bm.md/api/markdown/parse \
  -H "Content-Type: application/json" \
  -d '{
    "html": "<h1>标题</h1><p>这是一段<strong>加粗</strong>的文字。</p>"
  }' \
  -o bm.md.json

レスポンスの例：

{
  "result": "# 标题\n\n这是一段**加粗**的文字。"
}

---

3. プレーンテキストの抽出

Markdown からプレーンテキストの内容を抽出し、段落の区切りを維持したまま、すべての書式マークを削除します。

CLI の例（優先）:

npx -y bmmd extract article.md --output article.txt

エンドポイント: POST https://bm.md/api/markdown/extract

リクエストパラメーター:

パラメーター	型	必須	説明
markdown	string	はい	Markdown のソーステキスト

curl の例:

curl -X POST https://bm.md/api/markdown/extract \
  -H "Content-Type: application/json" \
  -d '{
    "markdown": "# 标题\n\n这是一段**加粗**的文字，包含[链接](https://example.com)。"
  }' \
  -o bm.md.json

レスポンスの例:

{
  "result": "标题\n\n这是一段加粗的文字，包含链接。"
}

---

4. Markdown のフォーマット

Markdown の書式の問題を検証して自動修正し、コードスタイルを統一します。

CLI の例（優先）:

# 输出修复后的 Markdown
npx -y bmmd lint article.md --output article.fixed.md

# 直接写回源文件
npx -y bmmd lint article.md --fix

エンドポイント: POST https://bm.md/api/markdown/lint

リクエストパラメーター:

パラメーター	型	必須	説明
markdown	string	はい	検証する Markdown のソーステキスト

curl の例:

curl -X POST https://bm.md/api/markdown/lint \
  -H "Content-Type: application/json" \
  -d '{
    "markdown": "#标题\n这是一段文字,没有正确的空格。\n-列表项1\n-列表项2"
  }' \
  -o bm.md.json

レスポンスの例:

{
  "result": "# 标题\n\n这是一段文字，没有正确的空格。\n\n- 列表项1\n- 列表项2"
}

---

パラメーターのリファレンス

レイアウトスタイル (markdownStyle)

ID	名前	スタイルの説明
kami	Kami	シンプルな紙面の読書スタイル（デフォルト）
bauhaus	Bauhaus	バウハウススタイル。幾何学と機能主義
blueprint	Blueprint	ブループリントスタイル。エンジニアリングデザインの雰囲気
botanical	Botanical	植物園スタイル。自然で柔らかな雰囲気
newsprint	Newsprint	新聞印刷スタイル
retro	Retro	レトロで懐かしいスタイル
sketch	Sketch	手描きのスケッチスタイル
terminal	Terminal	ターミナル／コマンドラインスタイル
forest-review	Forest Review	森林年報スタイル。暖色系の編集レイアウト
navy-vellum	Navy Vellum	ネイビーの羊皮紙スタイル。静謐な学術ノート
rose-nocturne	Rose Nocturne	ローズ・ノクターンスタイル。ダークトーンのファッション誌風編集
solar-catalog	Solar Catalog	ソーラーカタログスタイル。展示ポスターの質感
triad-paper	Triad Paper	トライアドペーパースタイル。三色のファッション誌風
field-tablet	Field Tablet	フィールドプレートスタイル。考古学ハンドブックの質感
public-square	Public Square	公共広場スタイル。アクティビズムのポスター
pixel-orbit	Pixel Orbit	ピクセルオービットスタイル。レトロなピクセルアーケード

コードテーマ (codeTheme)

ID	名前	種類
catppuccin-latte	Catppuccin Latte	ライト
catppuccin-frappe	Catppuccin Frappé	ダーク
catppuccin-macchiato	Catppuccin Macchiato	ダーク
catppuccin-mocha	Catppuccin Mocha	ダーク
kimbie-light	Kimbie Light	ライト
kimbie-dark	Kimbie Dark	ダーク
panda-syntax-light	Panda Syntax Light	ライト
panda-syntax-dark	Panda Syntax Dark	ダーク
paraiso-light	Paraiso Light	ライト
paraiso-dark	Paraiso Dark	ダーク
rose-pine-dawn	Rosé Pine Dawn	ライト
rose-pine	Rosé Pine	ダーク
tokyo-night-light	Tokyo Night Light	ライト
tokyo-night-dark	Tokyo Night Dark	ダーク

対象プラットフォーム (platform)

ID	説明
html	一般的なウェブページ。標準的な HTML 出力
wechat	WeChat 公式アカウント。WeChat エディター向けに最適化

---

注意事項

1. 数式：$...$（インライン）および $$...$$（ブロック）の構文をサポートします
2. GFM 構文：表、タスクリスト、取り消し線などを含む GitHub Flavored Markdown を完全にサポートします
3. 画像の処理：画像 URL は誰でもアクセスできる公開アドレスである必要があります
4. スタイルのインライン化：出力される HTML は CSS が要素にインライン化されているため、そのままコピーして使用できます
5. エンコーディング要件：リクエストとレスポンスはどちらも UTF-8 エンコーディングを使用します