baoyu-markdown-to-html

Name: baoyu-markdown-to-html
Author: jimliu

byjimliu· 68 skills

Installs

30k

Stars

24k

Forks

2.7k

How to install baoyu-markdown-to-html?

jimliu/baoyu-skills/baoyu-markdown-to-html

$npx -y skills add jimliu/baoyu-skills --skill baoyu-markdown-to-html

Installs into the current project.

›Prefer a prompt? Paste this to your agent

Use this skill

Run `npx skills use "https://github.com/jimliu/baoyu-skills" --skill "jimliu/baoyu-skills/baoyu-markdown-to-html"` and follow the generated skill instructions now. Read its complete output, redirecting it to a temporary file first if necessary. Resolve relative paths from the supporting-files directory it provides.

Use the whole pack

Use the skills in "https://github.com/jimliu/baoyu-skills" that are relevant to the current task. Run `npx skills add "https://github.com/jimliu/baoyu-skills"` and select the relevant skills, then follow their instructions.

Files · 1

View on GitHub

SKILL.md

1	# Markdown to HTML Converter
2
3	Converts Markdown files to beautifully styled HTML with inline CSS, optimized for WeChat Official Account and other platforms.
4
5	## User Input Tools
6
7	When this skill prompts the user, follow this tool-selection rule (priority order):
8
9	1. Prefer built-in user-input tools exposed by the current agent runtime — e.g., `AskUserQuestion`, `request_user_input`, `clarify`, `ask_user`, or any equivalent.
10	2. Fallback: if no such tool exists, emit a numbered plain-text message and ask the user to reply with the chosen number/answer for each question.
11	3. Batching: if the tool supports multiple questions per call, combine all applicable questions into a single call; if only single-question, ask them one at a time in priority order.
12
13	Concrete `AskUserQuestion` references below are examples — substitute the local equivalent in other runtimes.
14
15	## Script Directory
16
17	Agent Execution: Determine this SKILL.md directory as `{baseDir}`. Resolve `${BUN_X}` runtime: if `bun` installed → `bun`; if `npx` available → `npx -y bun`; else suggest installing bun. Replace `{baseDir}` and `${BUN_X}` with actual values.
18
19	\| Script \| Purpose \|
20	\|--------\|---------\|
21	\| `scripts/main.ts` \| Main entry point \|
22
23	## Preferences (EXTEND.md)
24
25	Check EXTEND.md in priority order — the first one found wins:
26
27	\| Priority \| Path \| Scope \|
28	\|----------\|------\|-------\|
29	\| 1 \| `.baoyu-skills/baoyu-markdown-to-html/EXTEND.md` \| Project \|
30	\| 2 \| `${XDG_CONFIG_HOME:-$HOME/.config}/baoyu-skills/baoyu-markdown-to-html/EXTEND.md` \| XDG \|
31	\| 3 \| `$HOME/.baoyu-skills/baoyu-markdown-to-html/EXTEND.md` \| User home \|
32
33	If none found, use defaults.
34
35	EXTEND.md supports: default theme, custom CSS variables, code block style, mermaid defaults (`mermaid_theme`, `mermaid_scale`, `mermaid_background`).
36
37	## Workflow
38
39	### Step 0: Pre-check (Chinese Content)
40
41	Condition: Only execute if input file contains Chinese text.
42
43	Detection:
44	1. Read input markdown file
45	2. Check if content contains CJK characters (Chinese/Japanese/Korean)
46	3. If no CJK content → skip to Step 1
47
48	Format Suggestion:
49
50	If CJK content detected AND `baoyu-format-markdown` skill is available:
51
52	Use `AskUserQuestion` to ask whether to format first. Formatting can fix:
53	- Bold markers with punctuation inside causing `**` parse failures
54	- CJK/English spacing issues
55
56	If user agrees: Invoke `baoyu-format-markdown` skill to format the file, then use formatted file as input.
57
58	If user declines: Continue with original file.
59
60	### Step 1: Determine Theme
61
62	Theme resolution order (first match wins):
63	1. User explicitly specified theme (CLI `--theme` or conversation)
64	2. EXTEND.md `default_theme` (this skill's own EXTEND.md, checked in Step 0)
65	3. `baoyu-post-to-wechat` EXTEND.md `default_theme` (cross-skill fallback)
66	4. If none found → use AskUserQuestion to confirm
67
68	Cross-skill EXTEND.md check (only if this skill's EXTEND.md has no `default_theme`):
69
70	Read `$HOME/.baoyu-skills/baoyu-post-to-wechat/EXTEND.md` if it exists and look for a `default_theme:` line. Use the value if present; otherwise fall through.
71
72	If theme is resolved from EXTEND.md: Use it directly, do NOT ask the user.
73
74	If no default found: use `AskUserQuestion` to confirm a theme from the [Themes](#themes) table below.
75
76	### Step 1.5: Determine Citation Mode
77
78	Default: Off. Do not ask by default.
79
80	Enable only if the user explicitly asks for "微信外链转底部引用", "底部引用", "文末引用", or passes `--cite`.
81
82	Behavior when enabled:
83	- Ordinary external links are rendered with numbered superscripts and collected under a final `引用链接` section.
84	- `https://mp.weixin.qq.com/...` links stay as direct links and are not moved to the bottom.
85	- Bare links where link text equals URL stay inline.
86
87	### Step 2: Convert
88
89	```bash
90	${BUN_X} {baseDir}/scripts/main.ts <markdown_file> --theme <theme> [--cite]
91	```
92
93	### Step 3: Report Result
94
95	Display the output path from JSON result. If backup was created, mention it.
96
97	## Usage
98
99	```bash
100	${BUN_X} {baseDir}/scripts/main.ts <markdown_file> [options]
101	```
102
103	Options:
104
105	\| Option \| Description \| Default \|
106	\|--------\|-------------\|---------\|
107	\| `--theme <name>` \| Theme name (default, grace, simple, modern) \| default \|
108	\| `--color <name\\|hex>` \| Primary color: preset name or hex value \| theme default \|
109	\| `--font-family <name>` \| Font: sans, serif, serif-cjk, mono, or CSS value \| theme default \|
110	\| `--font-size <N>` \| Font size: 14px, 15px, 16px, 17px, 18px \| 16px \|
111	\| `--title <title>` \| Override title from frontmatter \| \|
112	\| `--cite` \| Convert external links to bottom citations, append `引用链接` section \| false (off) \|
113	\| `--keep-title` \| Keep the first heading in content \| false (removed) \|
114	\| `--mermaid-theme <name>` \| Mermaid theme: `default`, `forest`, `dark`, `neutral`, `base` \| default \|
115	\| `--mermaid-scale <N>` \| Mermaid render scale (positive number ≤ 4) \| 2 \|
116	\| `--mermaid-width <N>` \| Mermaid target display width in CSS px; PNG is rendered at `width × scale` pixels when the diagram is narrower than this \| 860 \|
117	\| `--mermaid-bg <value>` \| Mermaid background: `white`, `transparent`, or `#hex` \| white \|
118	\| `--no-mermaid` \| Skip Mermaid PNG rendering; emit `<pre class="mermaid">` fallback \| false \|
119	\| `--help` \| Show help \| \|
120
121	Color Presets:
122
123	\| Name \| Hex \| Label \|
124	\|------\|-----\|-------\|
125	\| blue \| #0F4C81 \| Classic Blue \|
126	\| green \| #009874 \| Emerald Green \|
127	\| vermilion \| #FA5151 \| Vibrant Vermilion \|
128	\| yellow \| #FECE00 \| Lemon Yellow \|
129	\| purple \| #92617E \| Lavender Purple \|
130	\| sky \| #55C9EA \| Sky Blue \|
131	\| rose \| #B76E79 \| Rose Gold \|
132	\| olive \| #556B2F \| Olive Green \|
133	\| black \| #333333 \| Graphite Black \|
134	\| gray \| #A9A9A9 \| Smoke Gray \|
135	\| pink \| #FFB7C5 \| Sakura Pink \|
136	\| red \| #A93226 \| China Red \|
137	\| orange \| #D97757 \| Warm Orange (modern default) \|
138
139	Examples:
140
141	```bash
142	# Basic conversion (uses default theme, removes first heading)
143	${BUN_X} {baseDir}/scripts/main.ts article.md
144
145	# With specific theme
146	${BUN_X} {baseDir}/scripts/main.ts article.md --theme grace
147
148	# Theme with custom color
149	${BUN_X} {baseDir}/scripts/main.ts article.md --theme modern --color red
150
151	# Enable bottom citations for ordinary external links
152	${BUN_X} {baseDir}/scripts/main.ts article.md --cite
153
154	# Keep the first heading in content
155	${BUN_X} {baseDir}/scripts/main.ts article.md --keep-title
156
157	# Override title
158	${BUN_X} {baseDir}/scripts/main.ts article.md --title "My Article"
159	```
160
161	## Output
162
163	File location: Same directory as input markdown file.
164	- Input: `/path/to/article.md`
165	- Output: `/path/to/article.html`
166
167	Conflict handling: If HTML file already exists, it will be backed up first:
168	- Backup: `/path/to/article.html.bak-YYYYMMDDHHMMSS`
169
170	JSON output to stdout:
171
172	```json
173	{
174	"title": "Article Title",
175	"author": "Author Name",
176	"summary": "Article summary...",
177	"htmlPath": "/path/to/article.html",
178	"backupPath": "/path/to/article.html.bak-20260128180000",
179	"contentImages": [
180	{
181	"placeholder": "MDTOHTMLIMGPH_1",
182	"localPath": "/path/to/img.png",
183	"originalPath": "imgs/image.png"
184	}
185	],
186	"mermaidImages": [
187	{
188	"hash": "a1b2c3d4e5f6",
189	"localPath": "/path/to/imgs/.mermaid-cache/mermaid-a1b2c3d4e5f6.png",
190	"cached": false
191	}
192	]
193	}
194	```
195
196	Mermaid rendering: Code blocks fenced as ` ```mermaid ` are rendered to PNGs via headless Chrome (CDP) and cached at `imgs/.mermaid-cache/mermaid-<hash>.png`. The cache key includes the code, theme, scale, target width, background, and mermaid version. Add `imgs/.mermaid-cache/` to `.gitignore` if you do not want generated diagrams checked in. Requires Chrome/Chromium/Edge on the system; otherwise the block falls back to `<pre class="mermaid">…</pre>` and conversion still succeeds.
197
198	## Themes
199
200	\| Theme \| Description \|
201	\|-------\|-------------\|
202	\| `default` \| Classic - traditional layout, centered title with bottom border, H2 with white text on colored background \|
203	\| `grace` \| Elegant - text shadow, rounded cards, refined blockquotes (by @brzhang) \|
204	\| `simple` \| Minimal - modern minimalist, asymmetric rounded corners, clean whitespace (by @okooo5km) \|
205	\| `modern` \| Modern - large radius, pill-shaped titles, relaxed line height (pair with `--color red` for traditional red-gold style) \|
206
207	## Supported Markdown Features
208
209	\| Feature \| Syntax \|
210	\|---------\|--------\|
211	\| Headings \| `# H1` to `###### H6` \|
212	\| Bold/Italic \| `bold`, `italic` \|
213	\| Code blocks \| ` ```lang ` with syntax highlighting \|
214	\| Inline code \| `` `code` `` \|
215	\| Tables \| GitHub-flavored markdown tables \|
216	\| Images \| `![alt](src)` \|
217	\| Links \| `[text](url)`; add `--cite` to move ordinary external links into bottom references \|
218	\| Blockquotes \| `> quote` \|
219	\| Lists \| `-` unordered, `1.` ordered \|
220	\| Alerts \| `> [!NOTE]`, `> [!WARNING]`, etc. \|
221	\| Footnotes \| `[^1]` references \|
222	\| Ruby text \| `{base\|annotation}` \|
223	\| Mermaid \| ` ```mermaid ` blocks rendered to local PNG via headless Chrome (cached under `imgs/.mermaid-cache/`); falls back to `<pre class="mermaid">` if Chrome is unavailable or rendering fails \|
224	\| PlantUML \| ` ```plantuml ` diagrams \|
225
226	## Frontmatter
227
228	Supports YAML frontmatter for metadata:
229
230	```yaml
231	---
232	title: Article Title
233	author: Author Name
234	description: Article summary
235	---
236	```
237
238	If no title is found, extracts from first H1/H2 heading or uses filename.
239
240	## Extension Support
241
242	Custom configurations via EXTEND.md. See Preferences section for paths and supported options.

6 picks

Type

Run `npx skills use "https://github.com/jimliu/baoyu-skills" --skill "jimliu/baoyu-skills/baoyu-markdown-to-html"` and follow the generated skill instructions now. Read its complete output, redirecting it to a temporary file first if necessary. Resolve relative paths from the supporting-files directory it provides.

Use the skills in "https://github.com/jimliu/baoyu-skills" that are relevant to the current task. Run `npx skills add "https://github.com/jimliu/baoyu-skills"` and select the relevant skills, then follow their instructions.

baoyu-markdown-to-html

How to install baoyu-markdown-to-html?

Related

baoyu-markdown-to-html

How to install baoyu-markdown-to-html?

Related