stream-markdown-parser 0.0.1 → 0.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +281 -47
- package/README.zh-CN.md +279 -44
- package/dist/index.d.ts +305 -323
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +2274 -1671
- package/dist/index.js.map +1 -0
- package/package.json +33 -31
package/README.zh-CN.md
CHANGED
|
@@ -1,19 +1,23 @@
|
|
|
1
1
|
# stream-markdown-parser
|
|
2
2
|
|
|
3
|
-
轻量化、框架无关的 Markdown 解析器,使用 TypeScript 编写。输出为强类型的节点树,方便在 Vue、React 或任何运行时中渲染。
|
|
4
|
-
|
|
5
3
|
[](https://www.npmjs.com/package/stream-markdown-parser)
|
|
6
4
|
[](README.md)
|
|
7
5
|
[](https://www.npmjs.com/package/stream-markdown-parser)
|
|
8
6
|
[](https://bundlephobia.com/package/stream-markdown-parser)
|
|
9
7
|
[](./LICENSE)
|
|
10
8
|
|
|
11
|
-
|
|
9
|
+
纯 JavaScript Markdown 解析器和渲染工具,支持流式处理 - 框架无关。
|
|
10
|
+
|
|
11
|
+
该包包含从 `stream-markdown-parser` 中提取的核心 Markdown 解析逻辑,使其可以在任何 JavaScript/TypeScript 项目中使用,无需 Vue 依赖。
|
|
12
|
+
|
|
13
|
+
## 特性
|
|
12
14
|
|
|
13
|
-
-
|
|
14
|
-
-
|
|
15
|
-
-
|
|
16
|
-
-
|
|
15
|
+
- 🚀 **纯 JavaScript** - 无框架依赖
|
|
16
|
+
- 📦 **轻量级** - 最小打包体积
|
|
17
|
+
- 🔧 **可扩展** - 基于插件的架构
|
|
18
|
+
- 🎯 **类型安全** - 完整的 TypeScript 支持
|
|
19
|
+
- ⚡ **高性能** - 性能优化
|
|
20
|
+
- 🌊 **流式友好** - 支持渐进式解析
|
|
17
21
|
|
|
18
22
|
## 安装
|
|
19
23
|
|
|
@@ -21,76 +25,307 @@
|
|
|
21
25
|
pnpm add stream-markdown-parser
|
|
22
26
|
# 或
|
|
23
27
|
npm install stream-markdown-parser
|
|
28
|
+
# 或
|
|
29
|
+
yarn add stream-markdown-parser
|
|
24
30
|
```
|
|
25
31
|
|
|
26
|
-
##
|
|
32
|
+
## 使用
|
|
33
|
+
|
|
34
|
+
### 基础示例
|
|
27
35
|
|
|
28
|
-
```
|
|
36
|
+
```typescript
|
|
29
37
|
import { getMarkdown, parseMarkdownToStructure } from 'stream-markdown-parser'
|
|
30
38
|
|
|
39
|
+
// 创建一个带有默认插件的 markdown-it 实例
|
|
31
40
|
const md = getMarkdown()
|
|
41
|
+
|
|
42
|
+
// 将 Markdown 解析为 HTML
|
|
43
|
+
const html = md.render('# Hello World\n\nThis is **bold**.')
|
|
44
|
+
|
|
45
|
+
// 或解析为 AST 结构
|
|
32
46
|
const nodes = parseMarkdownToStructure('# Hello World', md)
|
|
33
47
|
console.log(nodes)
|
|
48
|
+
// [{ type: 'heading', level: 1, children: [...] }]
|
|
34
49
|
```
|
|
35
50
|
|
|
36
|
-
|
|
51
|
+
### 配置数学公式选项
|
|
52
|
+
|
|
53
|
+
```typescript
|
|
54
|
+
import { getMarkdown, setDefaultMathOptions } from 'stream-markdown-parser'
|
|
37
55
|
|
|
38
|
-
|
|
56
|
+
// 设置全局数学公式选项
|
|
57
|
+
setDefaultMathOptions({
|
|
58
|
+
commands: ['infty', 'perp', 'alpha'],
|
|
59
|
+
escapeExclamation: true
|
|
60
|
+
})
|
|
39
61
|
|
|
40
|
-
```ts
|
|
41
|
-
// 基本用法
|
|
42
62
|
const md = getMarkdown()
|
|
43
|
-
|
|
63
|
+
```
|
|
64
|
+
|
|
65
|
+
### 自定义国际化
|
|
66
|
+
|
|
67
|
+
```typescript
|
|
68
|
+
import { getMarkdown } from 'stream-markdown-parser'
|
|
44
69
|
|
|
45
|
-
//
|
|
46
|
-
const
|
|
47
|
-
|
|
70
|
+
// 使用翻译映射
|
|
71
|
+
const md = getMarkdown('editor-1', {
|
|
72
|
+
i18n: {
|
|
73
|
+
'common.copy': '复制',
|
|
74
|
+
}
|
|
75
|
+
})
|
|
48
76
|
|
|
49
|
-
//
|
|
50
|
-
const
|
|
51
|
-
|
|
77
|
+
// 或使用翻译函数
|
|
78
|
+
const md = getMarkdown('editor-1', {
|
|
79
|
+
i18n: (key: string) => translateFunction(key)
|
|
80
|
+
})
|
|
52
81
|
```
|
|
53
82
|
|
|
54
|
-
|
|
83
|
+
### 使用插件
|
|
55
84
|
|
|
56
|
-
```
|
|
57
|
-
import
|
|
58
|
-
import {
|
|
85
|
+
```typescript
|
|
86
|
+
import customPlugin from 'markdown-it-custom-plugin'
|
|
87
|
+
import { getMarkdown } from 'stream-markdown-parser'
|
|
59
88
|
|
|
60
|
-
const md =
|
|
61
|
-
|
|
62
|
-
|
|
89
|
+
const md = getMarkdown('editor-1', {
|
|
90
|
+
plugin: [
|
|
91
|
+
[customPlugin, { /* 选项 */ }]
|
|
92
|
+
]
|
|
93
|
+
})
|
|
63
94
|
```
|
|
64
95
|
|
|
65
|
-
|
|
96
|
+
### 高级:自定义规则
|
|
66
97
|
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
- `processTokens(tokens)`:将 markdown-it tokens 转换为节点
|
|
70
|
-
- `parseInlineTokens(tokens)`:解析内联 tokens
|
|
98
|
+
```typescript
|
|
99
|
+
import { getMarkdown } from 'stream-markdown-parser'
|
|
71
100
|
|
|
72
|
-
|
|
101
|
+
const md = getMarkdown('editor-1', {
|
|
102
|
+
apply: [
|
|
103
|
+
(md) => {
|
|
104
|
+
// 添加自定义内联规则
|
|
105
|
+
md.inline.ruler.before('emphasis', 'custom', (state, silent) => {
|
|
106
|
+
// 你的自定义逻辑
|
|
107
|
+
return false
|
|
108
|
+
})
|
|
109
|
+
}
|
|
110
|
+
]
|
|
111
|
+
})
|
|
112
|
+
```
|
|
73
113
|
|
|
74
|
-
##
|
|
114
|
+
## API
|
|
75
115
|
|
|
76
|
-
|
|
116
|
+
### 主要函数
|
|
77
117
|
|
|
78
|
-
|
|
118
|
+
#### `getMarkdown(msgId?, options?)`
|
|
79
119
|
|
|
80
|
-
|
|
120
|
+
创建一个配置好的 markdown-it 实例。
|
|
81
121
|
|
|
82
|
-
|
|
122
|
+
**参数:**
|
|
123
|
+
- `msgId` (string, 可选): 该实例的唯一标识符。默认值:`editor-${Date.now()}`
|
|
124
|
+
- `options` (GetMarkdownOptions, 可选): 配置选项
|
|
83
125
|
|
|
84
|
-
|
|
85
|
-
|
|
126
|
+
**选项:**
|
|
127
|
+
```typescript
|
|
128
|
+
interface GetMarkdownOptions {
|
|
129
|
+
// 要使用的 markdown-it 插件数组
|
|
130
|
+
plugin?: Array<Plugin | [Plugin, any]>
|
|
131
|
+
|
|
132
|
+
// 修改 md 实例的函数数组
|
|
133
|
+
apply?: Array<(md: MarkdownIt) => void>
|
|
134
|
+
|
|
135
|
+
// 翻译函数或翻译映射
|
|
136
|
+
i18n?: ((key: string) => string) | Record<string, string>
|
|
137
|
+
}
|
|
86
138
|
```
|
|
87
139
|
|
|
88
|
-
|
|
140
|
+
#### `parseMarkdownToStructure(content, md?, options?)`
|
|
89
141
|
|
|
90
|
-
|
|
91
|
-
|
|
142
|
+
将 Markdown 内容解析为结构化节点树。
|
|
143
|
+
|
|
144
|
+
**参数:**
|
|
145
|
+
- `content` (string): 要解析的 Markdown 内容
|
|
146
|
+
- `md` (MarkdownIt, 可选): markdown-it 实例。如果未提供,则使用 `getMarkdown()` 创建
|
|
147
|
+
- `options` (ParseOptions, 可选): 带有钩子的解析选项
|
|
148
|
+
|
|
149
|
+
**返回值:** `ParsedNode[]` - 解析后的节点数组
|
|
150
|
+
|
|
151
|
+
#### `processTokens(tokens)`
|
|
152
|
+
|
|
153
|
+
将原始 markdown-it tokens 处理为扁平数组。
|
|
154
|
+
|
|
155
|
+
#### `parseInlineTokens(tokens, md)`
|
|
156
|
+
|
|
157
|
+
解析内联 markdown-it tokens。
|
|
158
|
+
|
|
159
|
+
### 配置函数
|
|
160
|
+
|
|
161
|
+
#### `setDefaultMathOptions(options)`
|
|
162
|
+
|
|
163
|
+
设置全局数学公式渲染选项。
|
|
164
|
+
|
|
165
|
+
**参数:**
|
|
166
|
+
- `options` (MathOptions): 数学公式配置选项
|
|
167
|
+
|
|
168
|
+
```typescript
|
|
169
|
+
interface MathOptions {
|
|
170
|
+
commands?: readonly string[] // 要转义的 LaTeX 命令
|
|
171
|
+
escapeExclamation?: boolean // 转义独立的 '!' (默认: true)
|
|
172
|
+
}
|
|
173
|
+
```
|
|
174
|
+
|
|
175
|
+
### 工具函数
|
|
176
|
+
|
|
177
|
+
#### `isMathLike(content)`
|
|
178
|
+
|
|
179
|
+
启发式函数,用于检测内容是否类似数学符号。
|
|
180
|
+
|
|
181
|
+
**参数:**
|
|
182
|
+
- `content` (string): 要检查的内容
|
|
183
|
+
|
|
184
|
+
**返回值:** `boolean`
|
|
185
|
+
|
|
186
|
+
#### `findMatchingClose(src, startIdx, open, close)`
|
|
187
|
+
|
|
188
|
+
在字符串中查找匹配的闭合分隔符,处理嵌套对。
|
|
189
|
+
|
|
190
|
+
**参数:**
|
|
191
|
+
- `src` (string): 源字符串
|
|
192
|
+
- `startIdx` (number): 开始搜索的索引
|
|
193
|
+
- `open` (string): 开启分隔符
|
|
194
|
+
- `close` (string): 闭合分隔符
|
|
195
|
+
|
|
196
|
+
**返回值:** `number` - 匹配闭合的索引,如果未找到则返回 -1
|
|
197
|
+
|
|
198
|
+
#### `parseFenceToken(token)`
|
|
199
|
+
|
|
200
|
+
将代码围栏 token 解析为 CodeBlockNode。
|
|
201
|
+
|
|
202
|
+
**参数:**
|
|
203
|
+
- `token` (MarkdownToken): markdown-it token
|
|
204
|
+
|
|
205
|
+
**返回值:** `CodeBlockNode`
|
|
206
|
+
|
|
207
|
+
#### `normalizeStandaloneBackslashT(content, options?)`
|
|
208
|
+
|
|
209
|
+
规范化数学内容中的反斜杠-t 序列。
|
|
210
|
+
|
|
211
|
+
**参数:**
|
|
212
|
+
- `content` (string): 要规范化的内容
|
|
213
|
+
- `options` (MathOptions, 可选): 数学选项
|
|
214
|
+
|
|
215
|
+
**返回值:** `string`
|
|
216
|
+
|
|
217
|
+
### 插件函数
|
|
218
|
+
|
|
219
|
+
#### `applyMath(md, options?)`
|
|
220
|
+
|
|
221
|
+
将数学插件应用到 markdown-it 实例。
|
|
222
|
+
|
|
223
|
+
**参数:**
|
|
224
|
+
- `md` (MarkdownIt): markdown-it 实例
|
|
225
|
+
- `options` (MathOptions, 可选): 数学渲染选项
|
|
226
|
+
|
|
227
|
+
#### `applyContainers(md)`
|
|
228
|
+
|
|
229
|
+
将容器插件应用到 markdown-it 实例。
|
|
230
|
+
|
|
231
|
+
**参数:**
|
|
232
|
+
- `md` (MarkdownIt): markdown-it 实例
|
|
233
|
+
|
|
234
|
+
### 常量
|
|
235
|
+
|
|
236
|
+
#### `KATEX_COMMANDS`
|
|
237
|
+
|
|
238
|
+
用于转义的常用 KaTeX 命令数组。
|
|
239
|
+
|
|
240
|
+
#### `TEX_BRACE_COMMANDS`
|
|
241
|
+
|
|
242
|
+
使用大括号的 TeX 命令数组。
|
|
243
|
+
|
|
244
|
+
#### `ESCAPED_TEX_BRACE_COMMANDS`
|
|
245
|
+
|
|
246
|
+
用于正则表达式的 TEX_BRACE_COMMANDS 转义版本。
|
|
247
|
+
|
|
248
|
+
## 类型
|
|
249
|
+
|
|
250
|
+
所有 TypeScript 类型都已导出:
|
|
251
|
+
|
|
252
|
+
```typescript
|
|
253
|
+
import type {
|
|
254
|
+
// 节点类型
|
|
255
|
+
CodeBlockNode,
|
|
256
|
+
GetMarkdownOptions,
|
|
257
|
+
HeadingNode,
|
|
258
|
+
ListItemNode,
|
|
259
|
+
ListNode,
|
|
260
|
+
MathOptions,
|
|
261
|
+
ParagraphNode,
|
|
262
|
+
ParsedNode,
|
|
263
|
+
ParseOptions,
|
|
264
|
+
// ... 更多
|
|
265
|
+
} from 'stream-markdown-parser'
|
|
92
266
|
```
|
|
93
267
|
|
|
268
|
+
### 节点类型
|
|
269
|
+
|
|
270
|
+
解析器导出各种表示不同 Markdown 元素的节点类型:
|
|
271
|
+
|
|
272
|
+
- `TextNode`, `HeadingNode`, `ParagraphNode`
|
|
273
|
+
- `ListNode`, `ListItemNode`
|
|
274
|
+
- `CodeBlockNode`, `InlineCodeNode`
|
|
275
|
+
- `LinkNode`, `ImageNode`
|
|
276
|
+
- `BlockquoteNode`, `TableNode`
|
|
277
|
+
- `MathBlockNode`, `MathInlineNode`
|
|
278
|
+
- 以及更多...
|
|
279
|
+
|
|
280
|
+
## 默认插件
|
|
281
|
+
|
|
282
|
+
该包预配置了以下 markdown-it 插件:
|
|
283
|
+
|
|
284
|
+
- `markdown-it-sub` - 下标支持(`H~2~O`)
|
|
285
|
+
- `markdown-it-sup` - 上标支持(`x^2^`)
|
|
286
|
+
- `markdown-it-mark` - 高亮/标记支持(`==highlighted==`)
|
|
287
|
+
- `markdown-it-emoji` - Emoji 支持(`:smile:` → 😄)
|
|
288
|
+
- `markdown-it-task-checkbox` - 任务列表支持(`- [ ] Todo`)
|
|
289
|
+
- `markdown-it-ins` - 插入标签支持(`++inserted++`)
|
|
290
|
+
- `markdown-it-footnote` - 脚注支持
|
|
291
|
+
- `markdown-it-container` - 自定义容器支持(`::: warning`, `::: tip` 等)
|
|
292
|
+
- 数学公式支持 - 使用 `$...$` 和 `$$...$$` 渲染 LaTeX 数学公式
|
|
293
|
+
|
|
294
|
+
## 框架集成
|
|
295
|
+
|
|
296
|
+
虽然该包与框架无关,但它被设计为可以无缝配合以下框架使用:
|
|
297
|
+
|
|
298
|
+
- ✅ **Node.js** - 服务器端渲染
|
|
299
|
+
- ✅ **Vue 3** - 配合 `stream-markdown-parser` 使用
|
|
300
|
+
- ✅ **React** - 使用解析的节点进行自定义渲染
|
|
301
|
+
- ✅ **Vanilla JS** - 直接 HTML 渲染
|
|
302
|
+
- ✅ **任何框架** - 解析为 AST 并按需渲染
|
|
303
|
+
|
|
304
|
+
## 从 `stream-markdown-parser` 迁移
|
|
305
|
+
|
|
306
|
+
如果你正在从 `stream-markdown-parser` 中的 markdown 工具迁移:
|
|
307
|
+
|
|
308
|
+
```typescript
|
|
309
|
+
import { getMarkdown } from 'stream-markdown-parser'
|
|
310
|
+
```
|
|
311
|
+
|
|
312
|
+
所有 API 保持不变。详见[迁移指南](../../docs/monorepo-migration.md)。
|
|
313
|
+
|
|
314
|
+
## 性能
|
|
315
|
+
|
|
316
|
+
- **轻量级**: ~65KB 压缩后(13KB gzipped)
|
|
317
|
+
- **快速**: 针对实时解析优化
|
|
318
|
+
- **Tree-shakeable**: 只导入你需要的部分
|
|
319
|
+
- **零依赖**: 除了 markdown-it 及其插件
|
|
320
|
+
|
|
321
|
+
## 贡献
|
|
322
|
+
|
|
323
|
+
欢迎提交 Issues 和 PRs!请阅读[贡献指南](../../AGENTS.md)。
|
|
324
|
+
|
|
94
325
|
## 许可证
|
|
95
326
|
|
|
96
|
-
MIT
|
|
327
|
+
MIT © Simon He
|
|
328
|
+
|
|
329
|
+
## 相关项目
|
|
330
|
+
|
|
331
|
+
- [stream-markdown-parser](https://github.com/Simon-He95/vue-markdown-render) - 功能完整的 Vue 3 Markdown 渲染器
|