docs: 全面更新 README 与站点到 v0.2.5 最终状态
README: - badge 测试数 768→780,目录补语法高亮章节 - 特性修正:解析器 99% 行覆盖、六语言、16 个高亮语言标识 - 事件表补 selectionChange / cursorMove - 插件表补 exportPDF / searchReplace 大小写全字 / imagePaste maxSizeKB - XSS 章节补属性级注入防护说明 - 构建章节补 npm run bench - 源码结构补 5 个新模块(commands/floating-toolbar/context-menu/outline/highlight) site: - index.html: 测试数/gzip 体积更正(42KB)、新增语法高亮特性卡、 光标选区 API 速览卡、六语言文案 - demo.html: 启用内置高亮(highlight: MeEditor.highlight)、 新增 python/bash 代码块演示、v0.2.5 真实新特性列表、17 源文件/780 测试 - docs.html: 高亮章节补 16 标识与 CSS 定制示例、exportPDF/maxSizeKB/ 大小写全字说明、XSS 属性注入、静态 API 补 highlight 导入 src: - styles.ts: 新增 me-hl-* 高亮配色(深浅色自适应) - 修复复查引入的 TS 错误(普通函数 this 返回类型非法)
This commit is contained in:
@@ -4,7 +4,7 @@
|
||||
|
||||
[](https://git.metona.cn/MetonaTeam/-/packages/npm/@metona-team%2Fmetona-editor)
|
||||
[](./LICENSE)
|
||||
[](./tests)
|
||||
[](./tests)
|
||||
[](./tests)
|
||||
[](./tsconfig.json)
|
||||
|
||||
@@ -12,11 +12,11 @@
|
||||
|
||||
- **TypeScript 源码** — 全模块 TypeScript 严格模式,完整类型导出,IDE 智能提示
|
||||
- **零运行时依赖** — 打包后单文件,无任何第三方库,UMD / ESM / CJS 三种格式
|
||||
- **自研解析器** — CommonMark + GFM 扩展,96% 语句覆盖率,parseTokens / renderTokens 分离 API,registerBlockHandler 自定义块语法
|
||||
- **自研解析器** — CommonMark + GFM 扩展,99% 行覆盖率,parseTokens / renderTokens 分离 API,registerBlockHandler 自定义块语法
|
||||
- **插件系统 v2** — 拓扑排序依赖管理,6 个预设插件开箱即用,安装 / 卸载生命周期
|
||||
- **三模式视图** — edit / split / preview,拖拽分隔条调整比例,双向滚动同步
|
||||
- **主题系统** — light / dark / warm / auto,CSS 变量可定制,实例级隔离,主题继承,外部跟随
|
||||
- **国际化** — zh-CN / en-US / ja / ko 完整翻译,实例级语言隔离,远程加载翻译包
|
||||
- **国际化** — zh-CN / en-US / ja / ko / fr / de 六种语言完整翻译,实例级语言隔离,远程加载翻译包
|
||||
- **编辑体验** — 行号装订线、智能 Enter、括号自动闭合、拖放文件、大纲面板、Zen 专注模式、右键上下文菜单
|
||||
- **内置语法高亮** — 零依赖轻量高亮器,js/ts/python/bash/css/html 等 13 种语言,`MeEditor.highlight` 即插即用
|
||||
- **安全** — HTML 转义,XSS 协议过滤(javascript / vbscript / file / data),属性级注入防护,sanitize 钩子
|
||||
@@ -38,6 +38,7 @@
|
||||
- [事件系统](#事件系统)
|
||||
- [Markdown 解析器](#markdown-解析器)
|
||||
- [插件系统](#插件系统)
|
||||
- [语法高亮](#语法高亮)
|
||||
- [主题系统](#主题系统)
|
||||
- [国际化](#国际化)
|
||||
- [构建与测试](#构建与测试)
|
||||
@@ -146,7 +147,7 @@ MeEditor.create(container, {
|
||||
|
||||
// 主题与语言
|
||||
theme: 'auto', // 'light' | 'dark' | 'warm' | 'auto'
|
||||
locale: 'zh-CN', // 'zh-CN' | 'en-US'
|
||||
locale: 'zh-CN', // 'zh-CN' | 'en-US' | 'ja' | 'ko' | 'fr' | 'de'
|
||||
|
||||
// 渲染钩子
|
||||
render: null, // (md: string, env: RenderEnv) => string
|
||||
@@ -434,6 +435,8 @@ import { highlight, registerLanguage, getSupportedLanguages } from '@metona-team
|
||||
| `beforeChange` | 内容变更前 | `(oldValue, newValue, editor)` |
|
||||
| `afterChange` | 内容变更后 | `(newValue, editor)` |
|
||||
| `copy` | 复制到剪贴板 | `({ type })` |
|
||||
| `selectionChange` | 选区变化 | `({ start, end, text })` |
|
||||
| `cursorMove` | 光标移动 | `({ line, column })` |
|
||||
|
||||
### 全局钩子
|
||||
|
||||
@@ -529,6 +532,7 @@ registerBlockHandler({
|
||||
|
||||
- 所有文本经 `escapeHTML` 转义
|
||||
- 链接 URL 过滤 `javascript:` / `vbscript:` / `file:` / 非图片 `data:`
|
||||
- 属性级注入防护:`href` / `src` / `alt` / `title` / `language-*` 引号与换行均被转义
|
||||
- `data:image` 限制最大 500KB
|
||||
- `sanitize` 钩子供外部净化(如 DOMPurify)
|
||||
- `highlight` 钩子异常自动回退为纯文本
|
||||
@@ -565,9 +569,9 @@ editor.unuse('myPlugin');
|
||||
| 插件 | 说明 | 用法 |
|
||||
|------|------|------|
|
||||
| `autoSave` | localStorage 自动保存草稿 | `editor.use('autoSave', { delay: 1000 })` |
|
||||
| `exportTool` | 导出 .md / .html 文件 | `editor.use('exportTool'); editor.exportMarkdown()` |
|
||||
| `searchReplace` | Ctrl+F 查找 / Ctrl+H 替换 | `editor.use('searchReplace')` |
|
||||
| `imagePaste` | 粘贴剪贴板图片转 base64 | `editor.use('imagePaste')` |
|
||||
| `exportTool` | 导出 .md / .html 文件,支持 PDF(打印) | `editor.use('exportTool'); editor.exportMarkdown()` |
|
||||
| `searchReplace` | Ctrl+F 查找 / Ctrl+H 替换,支持正则、大小写、全字匹配 | `editor.use('searchReplace')` |
|
||||
| `imagePaste` | 粘贴剪贴板图片转 base64,可限尺寸 | `editor.use('imagePaste', { maxSizeKB: 500 })` |
|
||||
| `shortcutHelp` | 按 ? 弹出快捷键面板 | `editor.use('shortcutHelp')` |
|
||||
| `fileSystem` | File System Access API 读写磁盘 | `editor.use('fileSystem'); editor.openFile()` |
|
||||
|
||||
@@ -590,7 +594,7 @@ pluginUtils.getPreset('autoSave') // 预设副本
|
||||
|
||||
## 语法高亮
|
||||
|
||||
v0.2.5 起内置零依赖轻量高亮器(js / ts / tsx / jsx / python / bash / css / html / json / yaml / markdown / java / go / rust)。
|
||||
v0.2.5 起内置零依赖轻量高亮器,支持 js / ts / tsx / jsx / python / bash / css / html / json / yaml / markdown / java / go / rust(含 shell / md 别名共 16 个语言标识)。
|
||||
|
||||
```typescript
|
||||
import MeEditor from '@metona-team/metona-editor';
|
||||
@@ -605,7 +609,7 @@ const html = MeEditor.highlight(code, 'typescript');
|
||||
MeEditor.registerLanguage('myLang', { keywords: ['kw'], builtins: [] });
|
||||
```
|
||||
|
||||
高亮类名:`me-hl-keyword` / `me-hl-string` / `me-hl-comment` / `me-hl-number` / `me-hl-builtin` / `me-hl-function`。
|
||||
高亮类名:`me-hl-keyword` / `me-hl-string` / `me-hl-comment` / `me-hl-number` / `me-hl-builtin` / `me-hl-function`,内置浅色 / 深色自适应配色,也可用 CSS 覆盖定制。
|
||||
|
||||
---
|
||||
|
||||
@@ -745,6 +749,9 @@ npm test
|
||||
# 测试覆盖率
|
||||
npm run test -- --coverage
|
||||
|
||||
# 性能基准(先构建再运行)
|
||||
npm run build && npm run bench
|
||||
|
||||
# 代码格式化
|
||||
npm run format
|
||||
```
|
||||
@@ -764,18 +771,23 @@ dist/
|
||||
|
||||
```
|
||||
src/
|
||||
├── index.ts 入口 / 全局API
|
||||
├── core.ts MarkdownEditor 类
|
||||
├── parser.ts 自研 Markdown 解析器
|
||||
├── plugins.ts 插件系统 & 6 个预设
|
||||
├── themes.ts 主题系统
|
||||
├── i18n.ts 国际化
|
||||
├── styles.ts CSS-in-JS
|
||||
├── constants.ts 常量 / 类型定义
|
||||
├── utils.ts 工具函数
|
||||
├── animations.ts 动画元数据
|
||||
├── icons.ts 工具栏 SVG 图标
|
||||
└── locales.ts 中英文翻译数据
|
||||
├── index.ts 入口 / 全局API
|
||||
├── core.ts MarkdownEditor 类(构造 / 事件 / 历史 / 模式)
|
||||
├── commands.ts 编辑命令实现(包裹 / 前缀 / 插入 / 表格格式化)
|
||||
├── floating-toolbar.ts 选中文本浮动格式栏
|
||||
├── context-menu.ts 右键上下文菜单
|
||||
├── outline.ts 大纲面板
|
||||
├── parser.ts 自研 Markdown 解析器
|
||||
├── highlight.ts 内置轻量语法高亮器
|
||||
├── plugins.ts 插件系统 & 6 个预设
|
||||
├── themes.ts 主题系统
|
||||
├── i18n.ts 国际化
|
||||
├── styles.ts CSS-in-JS
|
||||
├── constants.ts 常量 / 类型定义
|
||||
├── utils.ts 工具函数
|
||||
├── animations.ts 动画元数据
|
||||
├── icons.ts 工具栏 SVG 图标
|
||||
└── locales.ts 六语言翻译数据
|
||||
```
|
||||
|
||||
### 技术栈
|
||||
|
||||
Reference in New Issue
Block a user