# Markdown 渲染功能依赖安装

## 需要安装的依赖

```bash
npm install marked highlight.js --save
```

或者使用 yarn:

```bash
yarn add marked highlight.js
```

## 依赖说明

- **marked** (v11.x): 轻量级 Markdown 解析和渲染库
- **highlight.js** (v11.x): 代码语法高亮库

## 安装后需要做的

1. 运行安装命令
2. 重启开发服务器
3. Markdown 渲染功能即可使用

## 功能特性

✅ **完整的 Markdown 支持**
- 标题 (H1-H6)
- 粗体、斜体、删除线
- 代码块和行内代码
- 引用块
- 有序列表和无序列表
- 表格
- 链接
- 图片

✅ **富媒体支持**
- 图片显示和点击放大
- 视频播放 (.mp4, .webm, .ogg, .avi, .mov)
- 音频播放 (.mp3, .wav, .ogg, .aac)

✅ **代码高亮**
- 支持 180+ 种编程语言
- 自动语言检测
- 代码块复制功能
- GitHub 风格样式

✅ **流式输出**
- 实时渲染 AI 回复
- 平滑的打字机效果
- 优化的性能

✅ **用户体验**
- 响应式设计
- 暗色/亮色主题适配
- 移动端优化
- 可访问性支持

## 使用示例

```vue
<MarkdownRenderer
  :content="message.content"
  :isUser="message.role === 'user'"
  :isStreaming="message.isLoading"
  :previousContentLength="message.previousLength || 0"
/>
```

## 自定义配置

如果需要自定义渲染行为,可以修改 `MarkdownRenderer.vue` 中的 `marked` 配置和自定义渲染器。