Docusaurus MDX Previewer

A VSCode extension to preview Docusaurus MDX files with real-time rendering, including support for PlantUML and Mermaid diagrams.

Features

Live Preview: Preview your Docusaurus MDX files in a single, reusable Webview panel.
Diagram Support: Render PlantUML and Mermaid diagrams using an external server (default: https://kroki.io).
Docusaurus Styling: Applies Docusaurus's light theme for consistent styling.
Real-time Updates: Automatically updates the preview when switching between MDX files or editing content.
Code Highlighting: Syntax highlighting for code blocks using rehype-highlight.

Install from VSIX:
- Download the .vsix file from the release section or shared source.
- In VSCode, go to Extensions view (Ctrl+Shift+X or Cmd+Shift+X on Mac), click the ... menu, and select "Install from VSIX".
- Choose the downloaded .vsix file.
Install from Marketplace:
- Search for "Docusaurus MDX Previewer" in the VSCode Marketplace and click "Install".

Open an MDX or Markdown file in VSCode.
Run the command Show Docusaurus MDX Preview:
- Press ctrl+alt+p (or cmd+alt+p on Mac) to open the Command Palette.
- Type and select Show Docusaurus MDX Preview.
The preview will appear in a panel beside your editor, updating automatically as you edit or switch files.

You can customize the diagram rendering server in VSCode settings:

Example:

{
  "docusaurusMdxPreview.plantumlServer": "https://your-custom-server.com"
}