Mind Map View

A mind mapping editor, in the style of a traditional desktop mind-mapper, for .md files, built directly into VS Code. It reads and writes plain markdown — headings and nested lists — with true bidirectional sync: edit the map, the file updates; edit the file (in a split view, another editor, git, whatever), the map updates. There is no proprietary format and no lock-in: every file this extension opens is a normal markdown file before, during, and after.

This extension is a port of an existing Obsidian community plugin with the same name and feature set, rebuilt for VS Code's custom-editor and webview model.

Source code available at: https://github.com/burak3000/vs-code-mind-map

Features

Getting started

1. Open a workspace containing a .md file (or create one).
2. Right-click its tab (or the file in the Explorer) → Reopen Editor With… → Mind Map. Or run Open as Mind Map from the Command Palette while the file is active.
3. Click a node to select it, Tab/Enter to grow the tree, and start typing.

An empty or new .md file opens as a single root node named after the file. The map is just the file's headings and list items — ## -level headings become first-level branches by default (mindmapView.headingDepth), deeper items become nested list items.

Keyboard shortcuts

Ctrl/Cmd+Z/Shift+Z/Y/F/K/Shift+B/M/Shift+D/Shift+I are chords VS Code would otherwise intercept before they reach the webview, so they're wired through contributes.keybindings scoped to the mind map editor — they only fire while a mind map tab is focused (or, for the markdown-ward direction of Ctrl/Cmd+M, while a markdown text editor is focused).

How the sync works

The markdown file is always the source of truth on disk. Opening it as a mind map parses the same headings/list-item structure the file already has — nothing is rewritten just by opening it. Every edit in the map (rename, add, delete, fold, move, etc.) re-serializes the in-memory model and writes it back to the file through VS Code's own edit/undo/save machinery (WorkspaceEdit), debounced (mindmapView.writeDebounceMs, default 400 ms) so a burst of keystrokes doesn't turn into a burst of edits.

If you edit the same file as plain text — in a split view, another editor, an external tool, git checkout, anything — the map notices (onDidChangeTextDocument, debounced by mindmapView.externalEditForwardDebounceMs, default 300 ms) and rebuilds itself from the new text, preserving your selection and first-level branch colors/sides where the structure still matches. If you have an unsaved edit in the map when an external change arrives, the map's own edit wins (a warning is shown) rather than silently discarding either side.

Node identity (used for folding, manual position, and links) is stored as an invisible trailing ^blockid on the relevant line, minted only the first time a node needs one — most nodes never get one at all.

Settings

All under mindmapView.*:

Requirements

VS Code ^1.85.0. No other runtime dependencies are installed alongside the extension — everything (including the d3-flextree layout library) is bundled into the two shipped scripts.

Known limitations

• Wikilinks and "Go to note section" resolve relative to the current file's own folder, not a workspace-wide index — unlike Obsidian, there's no vault-wide link graph to consult.
• Link-opening, image display, and clipboard-image paste assume a real filesystem path; they may not work over a virtual workspace (e.g. github.dev, a remote virtual filesystem provider). Reading and editing the map itself works normally in that case — see capabilities in package.json.
• Write-back always replaces the full document text (not a minimal range edit) — negligible cost even at 5,000 nodes (see benchmarks.md), but worth knowing if you're watching the file's own edit history.

Development

npm install
npm run build       # type-check + esbuild both bundles
npm run dev         # esbuild in watch mode (run this or `build` before F5)
npm test            # vitest, ~370 tests, ~2.5s
npm run bench:m1    # parse + layout
npm run bench:m2    # mutate + relayout + serialize
npm run bench:open  # full webview open path
npm run bench:images
npm run package     # build + vsce package -> mindmap-view-<version>.vsix

Press F5 in VS Code (uses .vscode/launch.json) to launch an Extension Development Host, then open any file under fixtures/ (generated by npm run fixtures) and Reopen Editor With… → Mind Map.

See DECISIONS.md for the architectural record, benchmarks.md for per-milestone performance numbers against budget, and PROGRESS.md for milestone status. RELEASING.md covers publishing to the Marketplace.

License

MIT — see LICENSE.