VS Code Markdown 微信公众号样式预览插件

一款 VS Code 插件，提供 Markdown 文件的微信公众号样式实时预览功能，集成 md-wx 组件，支持一键复制和图片粘贴上传。

这是小册 《玩转 Trae AI 编程》 的实战项目。

功能特性

• 🎨 实时预览: 在 VS Code 中实时预览 Markdown 文件的微信公众号样式效果
• 📱 微信样式: 完全还原微信公众号文章的排版样式，支持主题切换和视图模式切换
• 📋 一键复制: 支持将渲染后的内容直接复制到微信公众号后台
• 🖼️ 图片上传: 支持图片粘贴自动上传到 GitHub 图床
• 🗜️ 智能压缩: 自动压缩图片以减少文件大小，支持多种压缩质量等级

使用方法

1. 预览功能

1. 打开任意 Markdown 文件
2. 点击编辑器右上角的预览图标
3. 在预览面板中查看微信公众号样式效果
4. 使用内置的一键复制功能将内容复制到微信公众号后台

2. 图片粘贴上传

配置要求：

在 VS Code 设置中配置以下选项：

• md-wx-vscode.imageUpload.github.token: GitHub 个人访问令牌
• md-wx-vscode.imageUpload.github.repo: GitHub 仓库 (格式: username/repository)
• md-wx-vscode.imageUpload.github.branch: 分支名称 (默认: main)
• md-wx-vscode.imageUpload.github.path: 图片存储路径 (默认: images)

图片压缩配置：

• md-wx-vscode.imageCompression.enabled: 是否启用图片压缩 (默认: true)
• md-wx-vscode.imageCompression.quality: 压缩质量等级 (high/medium/low, 默认: high)
• md-wx-vscode.imageCompression.threshold: 文件大小阈值，超过此大小才压缩，单位 KB (默认: 500)

使用方法：

1. 复制一张图片到剪贴板
2. 在 Markdown 文件中按 Cmd+V (macOS) 或 Ctrl+V (Windows/Linux)
3. 插件会自动压缩并上传图片到 GitHub 仓库，然后插入 Markdown 链接

安装

1. 在 VS Code 扩展市场搜索 "Markdown WeChat Preview"
2. 点击安装
3. 重新加载 VS Code

常见问题

Q: 图片上传失败怎么办？

A: 请检查 GitHub token 权限和仓库配置是否正确。

Q: 图片压缩失败怎么办？

A: 压缩失败时会自动使用原图片，可以通过设置禁用压缩功能。

Q: 预览按钮没有显示怎么办？

A: 确保当前文件是 .md 格式，按钮只在 Markdown 文件中显示。

许可证

本项目采用 CC-BY-NC-ND-4.0 许可证 - 查看 LICENSE 文件了解详情。