--- name: wechat-markdown-html-render description: Render Markdown to polished HTML with WeChat-friendly typography and explicit theme layering. Use when users ask to convert Markdown articles to formatted HTML, replicate or analyze wechat.bmpi.dev theme behavior, or require text theme and code-block highlighting to be independently switchable. --- # Wechat Markdown Html Render ## Overview Render Markdown files into standalone HTML with separate style layers: `basic-theme`, `text-theme`, `code-theme`, and `font-theme`. Use `scripts/render-markdown-html.js` to generate deterministic output and keep code-block visuals independent from text theme. ## Workflow 1. Inspect site-mechanism notes in `references/wechat-bmpi-analysis.md` when the request mentions `wechat.bmpi.dev`. 2. Install dependencies in the skill folder: ```bash npm install ``` 3. Render Markdown, you can pick a text-theme and code-theme and font-theme according to article contents: ```bash node scripts/render-markdown-html.js \ --input /path/to/input.md \ --output /path/to/output.html \ --text-theme geek-black \ --code-theme wechat \ --font serif ``` 4. Validate that the output includes the four style blocks and that `--text-theme` and `--code-theme` can be changed independently. ## Script Interface - `--input`: Markdown source file path (required) - `--output`: HTML output file path (required) - `--text-theme`: `normal | orange-heart | geek-black | minimal-dark | gold-sea` (optional, default `gold-sea`) - `--code-theme`: `wechat | atomOneDark | atomOneLight | monokai | github | vs2015 | xcode` (optional, default `wechat`) - `--font`: `serif | sans` (optional, default `serif`) - `--title`: Custom HTML title (optional) - `--custom-css-file`: CSS file used only when `--text-theme custom` (optional) ## Notes - The script intentionally scopes markdown typography under `#nice` and syntax highlighting under `.hljs`/`pre code` selectors so code theme remains independent. - The output is standalone HTML and can be copied into downstream editors. ## WeChat MP editor list normalization (built into the renderer) The script applies two post-processing rules specifically to survive the WeChat 公众号 editor's non-standard HTML ingester. These are NOT optional — they're enabled for every render — but worth knowing when reviewing output or extending the script: 1. **Flatten `

…

` for leaf items.** The MP editor drops the list marker (the `1. 2. 3.` numbers, or `•` bullets) when a `

` contains a block-level child like `

`, and also inserts an extra blank row per item from the section's vertical margins. Fix: for `

` that does NOT contain a nested `

`. Items with nested sub-lists keep the section wrapper (their sub-list layout depends on it). 2. **Zero whitespace at `

Wechat Markdown Html Render

Description

Latest Changes

Install Wechat Markdown Html Render with One Click