MCPcopy Index your code
hub / github.com/Ben-love-zy/web-editor-markdown

github.com/Ben-love-zy/web-editor-markdown @v1.0.8

Chat with this repo
repository ↗ · DeepWiki ↗ · release v1.0.8 ↗ · + Follow
429 symbols 745 edges 84 files 48 documented · 11%
What it actually does AI analysis from the code graph — generated when you open this
loading…
README

web-editor-markdown

A markdown editor in browser, supports collaborative editing

npm bundle size

💡 Web Editor Markdown

web-editor-markdown is a Markdown editor based on Web browser and real-time rendering like Typora. It is based on TypeScript and JavaScript, and does not rely on any third-party framework. It supports Chinese friendly and can be easily extended and connected to native JavaScript, Vue, React, Angular and other applications. It provides four rendering modes: SOURCE, SOURCE_AND_PREVIEW, RENDER and PREVIEW. If necessary, its underlying layer also supports the ability of collaborative editing and provides atomic Operation for extending collaborative editing.

✨ English Demo

✨ Chinese Demo

🛠️ Getting started

  • install it
npm install web-editor-markdown --save
  • use it
import { Editor, withUndoRedo } from "web-editor-markdown";
let editor = new Editor(document.getElementById('id'));
editor = withUndoRedo(editor); // UndoRedo Plugin
editor.insertTextAtCursor('**This is a bold text**\n> tips:You can switch source mode with `cmd+/`');
  • others
import { EditorViewMode } from "web-editor-markdown";
editor.switchViewMode(EditorViewMode.PREVIEW); // switch rendering mode,(shortcut key: 'cmd+/')
console.log('content', editor.getContent());
  • local source
npm install
npm start

Extension points exported contracts — how you extend this code

Core symbols most depended-on inside this repo

Shape

Method 273
Class 130
Interface 13
Function 11
Enum 2

Languages

TypeScript100%

Modules by API surface

src/editor.ts28 symbols
src/markdown-parse/markdown-render/html-generate.ts27 symbols
src/markdown-parse/markdown-parser-line/index.ts20 symbols
src/view/base-view.ts16 symbols
src/markdown-parse/markdown-block-creater/creater.ts15 symbols
src/markdown-parse/node/node.ts14 symbols
src/event/hotkeys.ts13 symbols
src/model/text-model.ts10 symbols
src/model/selection-model.ts10 symbols
src/event/base-event.ts10 symbols
src/operations/set-selection-operation.ts9 symbols
src/markdown-parse/markdown-parser-block/index.ts9 symbols

For agents

$ claude mcp add web-editor-markdown \
  -- python -m otcore.mcp_server <graph>

⬇ download graph artifact

Ask about this repo answers extend the page