VS Code Extensions
SayDiagram

SayDiagram

by saydiagram

Preview Mermaid diagrams and open them in SayDiagram

Downloads

2

Rating

— (0)

Version

0.1.0

Last updated

Jul 19, 2026

Preview .mmd / .mermaid files locally, open them in SayDiagram, or jump to the Idea flow for AI generation.

Commands

  • SayDiagram: Preview Mermaid — local webview (CDN Mermaid). Also opens automatically when you open a .mmd / .mermaid file.
  • SayDiagram: Open in SayDiagram — creates a one-time handoff and opens the browser (sign in, then editor)
  • SayDiagram: Generate with AI — opens Idea flow with your prompt

Settings

  • saydiagram.appUrl — default https://saydiagram.com (use http://localhost:3000 for local)

Develop

cd vscode-extension
npm install
npm run build

Then in VS Code: Extensions: Install from Location… → this folder, or press F5 from an Extension Development Host.

Package a VSIX

cd vscode-extension
npm install
npm run package

Produces saydiagram-0.1.0.vsix. Install via Extensions: Install from VSIX….

From the monorepo root: npm run vscode:package.

Marketplace publish checklist

Code exit for Dev GTM is a packageable VSIX. Live Marketplace listing is a separate ops step:

  1. Create a Visual Studio Marketplace publisher (id must match "publisher" in package.json, currently saydiagram).
  2. Create a Personal Access Token in Azure DevOps with Marketplace → Manage scope.
  3. npm i -g @vscode/vsce (or use npx @vscode/vsce).
  4. cd vscode-extension && npm run package
  5. vsce login saydiagram then vsce publish (or vsce publish -p <PAT>).
  6. Confirm the listing at https://marketplace.visualstudio.com/items?itemName=saydiagram.saydiagram.

Do not claim “listed on Marketplace” in product copy until step 6 succeeds.

Related extensions