检测：在运行时检查可用工具。如果存在 mcp__chrome-devtools__navigate_page，则使用 Chrome DevTools MCP。如果存在 mcp__playwright__browser_navigate，则使用 Playwright MCP。

关键 URL

• 登录页面：https://wx.zsxq.com/login
• 文章编辑器：https://wx.zsxq.com/article?groupId={groupId}
• 默认星球 ID：51111858848454 (小木头的AI星球)

编辑器界面

知识星球文章编辑器有两种模式：

富文本模式（默认）

• 带有格式化工具栏的标准所见即所得编辑器
• 点击"切换到 Markdown 模式 (内测)"进行切换

Markdown 模式（推荐）

• 使用 Milkdown（基于 ProseMirror 的所见即所得 Markdown 编辑器）
• 将 Markdown 渲染为格式化内容（标题、加粗、链接、列表）
• 点击"切换到富文本模式"切换回去

重要：内容插入方法 Milkdown 编辑器需要通过 粘贴事件 插入内容，而不是直接填充：

• fill 工具 → 内容被视为纯文本，Markdown 不会被渲染
• 粘贴事件 → Milkdown 解析 Markdown 并正确渲染

Markdown 模式下的关键元素

• 标题输入框：文本框"请在这里输入标题"
• 内容区域：ProseMirror 编辑器（.ProseMirror 类）
• 保存按钮："保存"（保存为草稿）
• 预览按钮："预览"
• 发布按钮："发布"（请勿使用 - 始终保存为草稿）
• 标签："添加标签"

主要工作流程

步骤 1：准备内容

读取 Markdown 文件并提取：

• 标题（来自 H1 标题 # 标题 或文件名）

• 内容（完整的 Markdown 正文）

  读取 markdown 文件

  cat /path/to/article.md

步骤 2：导航到文章编辑器

# 导航到带有星球 ID 的文章编辑器
navigate_page: https://wx.zsxq.com/article?groupId=51111858848454

如果未登录，页面将重定向到登录页。提示用户手动登录：

请先登录知识星球，登录完成后告诉我。
Login URL: https://wx.zsxq.com/login

步骤 3：切换到 Markdown 模式

页面加载后，通过查找"切换到富文本模式"文本来检查是否已处于 Markdown 模式。

如果处于富文本模式（显示"切换到 Markdown 模式"）：

1. 点击"切换到 Markdown 模式 (内测)"
2. 点击"确定"确认对话框

// 检查当前模式

const switchBtn = document.querySelector('[class*="switch"]');
if (switchBtn && switchBtn.innerText.includes('切换到 Markdown')) {
  // 需要切换到 Markdown 模式
}

步骤 4：填写标题

1. 找到占位符为"请在这里输入标题"的标题文本框
2. 点击以聚焦
3. 输入标题

click: title textbox

fill: title textbox with article title

步骤 5：插入 Markdown 内容（通过粘贴事件）

关键：请勿使用 fill 工具 - 它会插入纯文本，而不会渲染 Markdown。

相反，使用 evaluate_script 来模拟粘贴事件：

// 模拟粘贴事件以触发 Milkdown 的 Markdown 解析
() => {
  const markdownContent = `YOUR_MARKDOWN_CONTENT_HERE`;

  const editorEl = document.querySelector('.ProseMirror');
  if (!editorEl) return { error: 'Editor not found' };

  // 聚焦编辑器
  editorEl.focus();

  // 创建并派发粘贴事件
  const clipboardData = new DataTransfer();
  clipboardData.setData('text/plain', markdownContent);

  const pasteEvent = new ClipboardEvent('paste', {
    bubbles: true,
    cancelable: true,
    clipboardData: clipboardData
  });

  editorEl.dispatchEvent(pasteEvent);

  return { success: true, charCount: markdownContent.length };
}

此方法：

1. 创建一个包含 Markdown 内容的 ClipboardEvent
2. 将其派发到 ProseMirror 编辑器
3. Milkdown 的粘贴处理器会解析并渲染 Markdown

步骤 6：添加标签（可选）

1. 点击"添加标签"
2. 输入标签文本
3. 确认

步骤 7：保存为草稿

重要：始终保存为草稿，切勿点击"发布"

1. 点击"保存"按钮以保存为草稿
2. 验证保存是否成功

click: "保存" button

步骤 8：验证并报告

保存后：

1. 检查成功消息或草稿状态
2. 向用户报告：

草稿已保存。请在知识星球中预览并手动发布。

Draft saved. Please review in Zsxq and publish manually.

完整示例流程

用户："把 /path/to/my-article.md 发布到知识星球"

1. 读取 /path/to/my-article.md
   - 从 H1 或第一行提取标题
   - 获取完整内容

2. 导航到 https://wx.zsxq.com/article?groupId=51111858848454

3. 检查是否已登录
   - 如果未登录，提示用户登录

4. 如果需要，切换到 Markdown 模式
   - 点击"切换到 Markdown 模式 (内测)"
   - 确认对话框

5. 填写标题
   - 点击标题输入框
   - 使用 `fill` 工具设置标题文本

6. 通过粘贴事件插入内容
   - 使用 `evaluate_script` 模拟粘贴事件
   - 这会触发 Milkdown 解析并渲染 Markdown

7. 保存为草稿
   - 点击"保存"

8. 报告成功
   - "草稿已保存，请手动预览并发布"

关键规则

1. 切勿点击"发布" - 仅使用"保存"保存为草稿
2. 始终使用 Markdown 模式 - 如果处于富文本模式，请切换
3. 检查登录状态 - 如果需要，提示用户登录
4. 保留原始文件 - 切勿修改源 Markdown 文件
5. 报告完成情况 - 告知用户草稿已保存，需要手动审核

故障排除

Markdown 未渲染（显示原始语法）

如果您看到原始的 Markdown 语法（如 **bold** 或 [link](url)）而不是渲染后的格式：

• 原因：内容使用 fill 工具插入，而不是粘贴事件
• 解决方案：使用 evaluate_script 方法模拟粘贴事件（参见步骤 5）

Milkdown 编辑器仅在内容被粘贴时解析 Markdown，而不是直接设置时。

需要登录

如果页面重定向或显示登录提示：

请先登录知识星球: https://wx.zsxq.com/login
登录完成后告诉我。

内容过长

知识星球有 100,000 个字符的限制。如果内容超出：

文章内容超过100000字符限制，请考虑拆分文章。

切换模式对话框

切换到 Markdown 模式时，会出现一个确认对话框：

• 消息："确定要切换编辑器？当前内容将不会同步至新编辑器"
• 点击"确定"确认

编辑器未加载

如果编辑器元素不可见：

1. 等待页面完全加载
2. 获取新的快照
3. 如果仍未加载，刷新页面

元素参考

图片上传

图片上传在富文本模式和 Markdown 模式下均可使用 upload_file 工具。

前提条件

• 首先检查图片文件大小：如果 > 500KB，压缩为 WebP 或降低质量
• 使用 ls -la /path/to/image.png 检查文件大小

图片上传工作流程

图片上传适用于两种编辑器模式中的图片按钮：

1. 获取快照 以找到图片按钮的 ref/uid

   • 富文本模式：button "image"
   • Markdown 模式：generic description="Add image"

2. 上传图片

Chrome DevTools MCP：

     upload_file:
       uid: <image button uid>
       filePath: /path/to/image.png
     

Playwright MCP：

     browser_file_upload:
       ref: <image button ref>
       paths: ["/path/to/image.png"]
     

3. 验证上传 - 截图确认图片出现在编辑器中

图片上传的关键元素

图片上传示例（Markdown 模式）

# 1. 获取详细快照以找到图片按钮
take_snapshot(verbose=true)

# 2. 找到"Add image"按钮（例如，uid=26_59）
# 查找：generic description="Add image"

# 3. 直接上传图片到该按钮
upload_file:
  uid: 26_59  # （"Add image"按钮的示例 uid）
  filePath: /Users/user/Downloads/image.png

# 4. 通过截图验证
take_screenshot

图片上传示例（富文本模式）

# 1. 获取快照以找到图片按钮
take_snapshot

# 2. 找到图片按钮（例如，uid=12_7）
# 查找：button "image"

# 3. 上传图片到该按钮
upload_file:
  uid: 12_7  # （图片按钮的示例 uid）
  filePath: /Users/user/Downloads/image.png

# 4. 通过截图验证
take_screenshot

图片大小限制

• 最大推荐值：每张图片 500KB

• 对于更大的图片，请先使用 ImageMagick 或 sips 等工具压缩：

  # 检查大小
  ls -la /path/to/image.png
  
  # 如果需要压缩（macOS）
  sips -s format jpeg -s formatOptions 80 /path/to/image.png --out /path/to/image_compressed.jpg
  

图片上传故障排除

上传后图片未出现：

• 获取新的详细快照以获取图片按钮的正确 uid
• 验证图片文件存在且可访问
• 检查字数统计指示器 - 成功上传后应增加

找到正确的按钮 uid：

• 使用 take_snapshot(verbose=true) 查看元素描述
• 在 Markdown 模式下，查找 generic description="Add image"
• 在富文本模式下，查找 button "image"

技术细节

知识星球文章编辑器使用两种不同的编辑器：

富文本模式（Quill）

• Quill：一个现代的所见即所得编辑器
• 图片上传：通过 upload_file 工具到 button "image" 实现
• 工具栏：包括图片在内的标准格式化按钮

Markdown 模式（Milkdown）

• Milkdown：一个插件驱动的所见即所得 Markdown 编辑器
• ProseMirror：底层的富文本编辑框架
• 粘贴处理：Milkdown 拦截粘贴事件并解析 Markdown 内容
• 图片上传：通过 upload_file 工具到 generic description="Add image" 实现

这就是为什么用户通过 md.bytenote.net 的工作流程有效的原因 - 从任何来源粘贴都会触发 Milkdown 的 Markdown 解析器，从而产生正确渲染的内容。

每周安装次数

66

仓库

sugarforever/01…t-skills

GitHub Stars

75

首次出现

Jan 31, 2026

安全审计

Gen Agent Trust HubPassSocketPassSnykFail

安装于

codex60

opencode59

gemini-cli58

cursor57

github-copilot56

amp54