1. Project Overview

WeChat Markdown Editor

✍ WeChat Markdown Editor | A clean and minimalist Markdown editor for WeChat: supports Markdown syntax, customizable themes and styles, content management, multiple image hosting services, an AI assistant, and more.

2. Open Source License

Licensed under the WTFPL open-source license.

3. Screenshots

 Product Demo

Product Demo

 

Theme Switching	️ Image Upload

 

 

 

 

Style Extensions	One-Click Formatting

4. Feature Overview

Automatically renders Markdown documents into WeChat articles in real time, so you no longer need to worry about formatting WeChat content! As long as you know basic Markdown syntax (with AI available today, you don't even need to know Markdown), you can create beautiful, clean, and elegant WeChat articles.

✨ Features

 Core Function

• ✅ Full Markdown Support - Supports all basic syntax and mathematical formulas
• ✅ Chart Rendering - Supports Mermaid diagrams and GFM alert blocks
• ✅ PlantUML Support - Powerful UML diagram rendering
• ✅ Ruby Annotation Extension - Supports [text]{annotation} and [text]^(annotation) formats, with multiple separator options

 Editing Experience

• ✅ Code Highlighting - Rich code block highlighting themes improve code readability
• ✅ Customizable styles - Allows customization of theme colors and CSS styles for flexible presentation
• ✅ Draft Saving - Built-in local content management with automatic draft saving

 Advanced Features

• ✅ Multiple Image Hosting Services - Provides multiple image hosting options and convenient image upload functionality
• ✅ File management - Convenient file import and export features to improve work efficiency
• ✅ AI Integration - Integrates mainstream AI models (DeepSeek, OpenAI, Tongyi Qianwen, Tencent Hunyuan, Volcengine Ark, 302.AI, etc.) to intelligently assist content creation

5. Tech Stack

️ Development and Deployment

# Install Node.js
nvm i && nvm use
# Install dependencies
pnpm i
# Start development mode
pnpm web dev
# Access http://localhost:5173/md/
# Deploy in the /md directory
pnpm web build
# Deploy in the root directory
pnpm web build:h5-netlify
# Start and Debug the Chrome Extension
pnpm web ext:dev
# Access chrome://extensions/ Enable Developer Mode, select Load unpacked, and choose the apps/web/.output/chrome-mv3-dev directory
# Package the Chrome Extension
pnpm web ext:zip
# Package the Firefox Extension (how to build Firefox addon)
pnpm web firefox:zip # output zip file at in apps/web/.output/md-{version}-firefox.zip
# Package the uTools Plugin
pnpm utools:package # output zip file at apps/utools/release/md-utools-v{version}.zip
# cloudflare workers
pnpm web wrangler:dev # Cloudflare Workers Development Mode
pnpm web wrangler:deploy # Cloudflare Workers Deployment Command

 Quickly Set Up a Private Service

 Method 1. Using npm CLI

With our npm CLI, you can easily set up your own WeChat Markdown Editor.

# Installation
npm i -g @doocs/md-cli
# Start
md-cli
# Access
open http://127.0.0.1:8800
# Start and Specify a Port
md-cli port=8899
# Access
open http://127.0.0.1:8899

md-cli supports the following command-line arguments:

• port specifies the port number. The default is 8800. If the port is occupied, a new port will be selected randomly.
• spaceId configures the dcloud service space
• clientSecret dcloud service space configuration

 Method 2. Using a Docker Image

If you are a Docker user, you can also start it directly with a single commandA fully private instance that belongs entirely to you。

docker run -d -p 8080:80 doocs/md:latest

Once the container is running, open your browser and visit [http://localhost:8080](http://localhost:8080).