anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
正则表达式可实现轻量级 markdown 到 html 转换，适用于简单文档、日志渲染等场景，但不支持复杂嵌套；需按行/段落逐层匹配标题、强调、代码、链接等元素，注意顺序、非贪婪匹配及 html 转义。
正则表达式可以完成 Markdown 到 HTML 的轻量级转换，适合简单文档、日志渲染或嵌入式场景，但不适用于复杂嵌套（如表格、多层列表、块引用嵌套等）。核心思路是按行或按段落匹配常见 Markdown 元素，逐层替换为对应 HTML 标签，注意匹配顺序和转义处理。
基础文本格式：强调与代码
斜体、粗体、行内代码属于行内元素，应优先处理，避免被后续规则干扰。使用非贪婪匹配防止跨标记误捕。
-
// 斜体：*text* 或 _text_（不跨空格或标点）
/(\*|_)([^*\n]+?)\1/g→<em>$2</em> -
// 粗体：**text** 或 __text__
/(\*\*|__)([^*\n]+?)\1/g→<strong>$2</strong> -
// 行内代码：`code`
/`([^`\n]+)`/g→<code>$1
标题与段落：按行解析结构
Markdown 标题以行首 # 开头，段落是无特殊前缀的非空行。需先按换行符分割，再逐行判断类型。
-
// 一级到六级标题：# h1、## h2 … ##### h5、###### h6
^#{1,6}\s+(.+)$（多行模式）→<h>$2</h>$1>（注意捕获组编号） -
// 普通段落：非空且不匹配其他块级规则的行（需前后加 ）
对剩余未处理行，用^([^\n]+)$匹配后包裹为<p>$1</p>
链接与图片：提取属性并构造标签
链接和图片语法相似，都含方括号+圆括号，区别在于图片多一个前置 !。需确保括号内容不包含未转义的括号。
-
// 图片：
!\[([^\]]*)\]\(([^)\s]+)(?:\s+"([^"]*)")?\)→<img src="%242" alt="$1">（title 可选，可追加title="$3"） -
// 链接：[text](url "title")
\[([^\]]*)\]\(([^)\s]+)(?:\s+"([^"]*)")?\)→@#@#@#@#@#@#@#@#@#@0
安全与边界注意事项
正则转换易受注入与误匹配影响，必须做基础防护：
- HTML 特殊字符需在替换前转义（如
&→&，→ <code>），尤其在段落文本和 alt/title 属性中 - 避免全局贪婪匹配导致长文本吞掉多个结构，所有量词尽量用
+?或*? - 不支持混合结构，例如
**hello *world***会出错；建议预处理——先转义冲突符号（如将内部*替换为\*）或限制输入格式 - 换行符统一为
\n，启用多行标志m处理 ^ 和 $，启用全局标志g实现全部替换
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
