Github 10.4k Star!一款开源免费高效的Markdown编辑器!

Vditor

Vditor是一款浏览器端的Markdown编辑器,支持所见即所得、即时渲染(类似Typora)和分屏预览模式。它使用TypeScript实现,支持原生JavaScript以及Vue、React、Angular和Svelte等框架。

在Github上已经斩获10.4k Star!

核心特性

多模式编辑体验

  • 所见即所得模式:像 Word 一样直观编辑

  • 即时渲染模式:传统 Markdown 编辑体验

  • 分屏预览模式:左侧编辑,右侧实时预览

强大的扩展功能

  • 支持流程图、时序图、甘特图等图表渲染

  • 数学公式支持(LaTeX)

  • 脑图(Mind Map)支持

  • 图表支持(ECharts)

卓越的性能

  • 采用虚拟DOM技术,编辑流畅

  • 支持万级字数文档编辑不卡顿

丰富的 API

  • 提供完整的TypeScript类型定义

  • 易于二次开发和集成

多主题支持

  • 内置多种主题,适应不同场景

  • 支持自定义主题

语法支持

  • 所有 CommonMark 语法:分隔线、ATX 标题、Setext 标题、缩进代码块、围栏代码块、HTML 块、链接引用定义、段落、块引用、列表、反斜杠转义、HTML 实体、行级代码、强调、加粗、链接、图片、行级 HTML、硬换行、软换行和纯文本。

  • 所有 GFM 语法:表格、任务列表项、删除线、自动链接、XSS 过滤

  • 常用 Markdown 扩展语法:脚注、ToC、自定义标题 ID

  • 图表语法:流程图、时序图、甘特图,通过 Mermaid 支持、Graphviz、折线图、饼图、脑图等,通过 ECharts 支持

  • 五线谱:通过 abc.js 支持

  • 数学公式:数学公式块、行级数学公式,通过 MathJax 和 KaTeX 支持

  • YAML Front Matter

  • 中文语境优化:中西文之间插入空格、术语拼写修正、中文后跟英文逗号句号等标点替换为中文对应标点

核心功能

编辑模式

所见即所得(WYSIWYG)

所见即所得模式对不熟悉 Markdown 的用户较为友好,熟悉 Markdown 的话也可以无缝使用。

即时渲染(IR)

即时渲染模式对熟悉 Typora 的用户应该不会感到陌生,理论上这是最优雅的 Markdown 编辑方式。

分屏预览(SV)

传统的分屏预览模式适合大屏下的 Markdown 编辑。

主题

编辑器主题

编辑器所展现的外观。内置classic,dark 2 套主题。

内容主题

Markdown 输出的 HTML 所展现的外观。内置 ant-design, light,dark,wechat 4 套主题。支持内容主题扩展接口。

代码主题

代码块所展现的外观。内置 github 等 36 套主题。

安装

克隆代码

复制代码
git clone https://github.com/Vanessa219/vditor.git

安装依赖

复制代码
npm install

启动服务

复制代码
pm run start

访问服务

复制代码
http://localhost:9000

使用

数学公式

脑图

流程图

时序图

甘特图

图标

五线谱

Graphviz

开源地址

https://github.com/Vanessa219/vditor

相关推荐
海蓝可知天湛17 小时前
Agent&IELTS雅思口语专属语料库
人工智能·github·rag·ielts·skills
ServBay17 小时前
OpenCode 和它的7款必备插件
后端·github·ai编程
Yunzenn18 小时前
字节最新研究cola-DLM第 01 章:语言生成的三次范式之争 —— 从 RNN 到 AR 到扩散
架构·github
wangruofeng18 小时前
GitHub AI 月榜解读:8 大趋势告诉你该关注什么
github·ai编程
小小测试开发21 小时前
AI 水印攻防战:OpenAI 引入 SynthID 认证,GitHub 同步出现去水印工具
人工智能·github
微软技术栈1 天前
Microsoft AI Genius 4.0 | 使用 GitHub Copilot SDK 升级开发者体验
人工智能·microsoft·github
小雨青年1 天前
GitHub Actions 时区 Cron 和 Environment deployment false 实战
github
2601_955781981 天前
整合Kimi 大模型 OpenClaw 自动化能力再度升级
开源·github·kimi·open claw安装·open claw部署
淘矿人1 天前
【AI大模型】AI 大模型推理平台完整测评:8 家主流聚合服务对比分析
人工智能·sql·gpt·学习·github·php
逛逛GitHub1 天前
有人花 3 天做了个开源工具,一句话生成各种场景的 HTML。
github