VSCode悬浮提示怎么显示Markdown格式？富文本渲染方法-VSCode-PHP中文网

VSCode悬浮提示默认不渲染Markdown，仅支持有限HTML标签如、、等，Markdown语法如加粗或链接原样显示；需手动转换为白名单标签且禁用样式与交互。

vscode悬浮提示怎么显示markdown格式？富文本渲染方法

VSCode悬浮提示默认不渲染Markdown

VSCode 的 hover 提示（鼠标悬停时弹出的 tooltip）原生只支持纯文本和极简 HTML 标签（如 、），不解析 Markdown 语法。写 **加粗** 或 [链接](#)，它就原样显示字符串，不会变粗、不会跳转、也不会换行——这不是配置没开，是语言服务器或编辑器本身没这个能力。

常见错误现象：
• 写了 /** @returns {string} 返回值说明：**支持中文** */，悬停里看到的是字面量 **支持中文**
• 在 TypeScript 的 JSDoc 里用 ```ts 包代码块，结果整段当一行文本挤在一起
• 用 markdown-it 渲染好 HTML 字符串传给 HoverProvider，但发现

、等标签被过滤或忽略

要让 hover 显示富文本，必须返回 HTML 字符串并遵守白名单规则

VSCode 的 HoverProvider.provideHover 接口允许返回 MarkedString[] 或 Hover 对象，其中内容字段若为字符串，会被当作「支持有限 HTML」的富文本处理。但注意：
• 只有 、

、、、
、、、、

 等少数标签被保留
• 所有属性（如 class、style、onclick）一律被剥离
•  标签不生效，无法点击跳转

实操建议：
• 不要用 marked 或 markdown-it 直接输出完整 HTML——它们生成的

、 全部被删，只剩文本
• 手动映射常用 Markdown 元素到白名单标签：
 – **text** → text
 – *text* → text
 – 代码块用 <code>...</code>，别嵌套 
• 换行必须显式写 
，Markdown 的空行或双空格无效
• 中文标点、Unicode 符号可直接使用，无需转义自定义 HoverProvider 时容易漏掉的兼容点
如果你在写插件或 Language Server，返回 Hover 对象时，以下细节直接影响渲染效果：
• contents 字段如果是 MarkedString 数组，每个元素会被拼接，但换行需靠 
 或 
，不能依赖数组分隔
• 若含 Location（比如想让 hover 里带跳转链接），VSCode 仅在 vscode:// 协议下支持，且只响应 Location，不响应 HTML 里的 
• 字体大小、颜色、行高完全由 VSCode 主题控制，无法通过内联 style 覆盖
• 长文本会自动截断并显示“…”——没有 API 控制展开，只能精简内容
一个最小可行示例（TypeScript）：


											
												
												
													Convert Markdown To HTML And PDF - Markdown和HTML、PDF互转
													实现 Markdown↔ HTML 互转，支持导出 PDF，用于用户请求的文档格式转换。
												
												下载
												
											
										
provideHover(document, position, token) {<br>  const range = document.getWordRangeAtPosition(position);<br>  const word = document.getText(range);<br>  return new Hover([<br>    '<p><strong>参数名</strong>：</p>',<br>    '<p>类型：<code>string</code><br>用途：标识用户 ID</p>',<br>    '<pre class="brush:php;toolbar:false;"><code>getUser("123")</code>
'
  ]);
}
真正难的不是怎么写 HTML，而是判断哪些信息值得放进 hover——它空间极小、无交互、不可滚动。公式、表格、多级列表、Mermaid 图表，全都不适合放进去。这类内容应该引导用户去预览页或文档页，而不是硬塞进 tooltip。