【程序员副业指南】KwaiKAT AI制作小红薯📕卡片MCP

【程序员副业指南】KwaiKAT AI制作小红薯📕卡片MCP

背景

每个程序员都熟悉计算机，是最适合写技术博客以及做分享的人。最近发现了一个Markdown转知识卡片，值得注意的是，可以利用这个快速制作小红薯📕卡片，但是有点小贵，对于我这样的白嫖党，那肯定是负担不起的，于是决定利用KAT-Coder-Pro V1复刻一个小红薯📕卡片MCP。

效果展示

本项目已开源：github.com/lfrbmw/Litt...

有朋友问这个有什么用，最近来看效果，你的到一个可以直接发的小红📕卡片，示例如下，直接输出一张可发布小红书的笔记，还提供多个样式。

零代码开发小红薯📕卡片MCP

前置准备-接入KAT-Coder-Pro V1

这里就不过多的描述，可以参考，KAT-Coder-Pro V1 开发工具接入指南：www.streamlake.com/document/WA...

推荐使用Cline，1分钟就配置好了。

在cline配置好的效果。

准备提示词

bash 复制代码

开发一个小红书卡片MCP
功能：
1.将 Markdown 文档转换为精美的知识卡片，支持多种风格
2.支持 多 种主题样式：苹果备忘录 波普艺术 艺术装饰 玻璃拟态 温暖柔和 简约高级灰 梦幻渐变 清新自然 紫色小红书 笔记本 暗黑科技 复古打字机 水彩艺术 中国传统 儿童童话 商务简报 日本杂志 极简黑白 赛博朋克
3.如果长文就自动拆分
4.支持直接读取 Markdown 文件（可选择）
5.支持通过 type 参数直接指定卡片类型/尺寸（可选择）

# 注意
1. 注意符合mcp开发
2. 注意中文编码问题

# 任务
根据 用户故事 和提供的 功能 生成小红书卡片MCP，以及相关注意点，将本项目上传至 MCP，并确保像 CodeBuddy 和 Cursor 这类工具也能让其他人正常使用这个 MCP 项目。
当前项目的 GitHub 地址已配置好，为 https://github.com/lfrbmw/Little-Red-Book-Card-MCP.git。后续要完成将项目上传至 GitHub 并发布到 NPM 的操作

创建一个空文件夹就可以开始让AI干活了。

仅仅一次，就完成了从设计到成品，再到测试，可以看到在测试中遇到的问题它都会去处理，只有通过测试，它才会发布到npm。

遇到错误，分分钟就处理好了。

在测试完后，会自己主动的删除删除文件。

直接就在npm部署成功。

接下来就是在trae中配置这个MCP，进行实际的测试。

可以看到成功的制作并部署了一个小红书卡片mcp。其中有2个功能：

复制代码

将Markdown内容转换为知识卡片
列出所有可用的主题样式

对它说：列出所有可用的主题样式，可以看到，成功的列出了我们初始化时给出的19个主题。

修修补补项目

在测试过程中，它没有实际的实现目标，我们只需要对他说出我们的目的，他会自行的优化。

swift 复制代码

测试过程实际使用mcp过程中，交互如下，
{
  "content": "# 高效学习的五个技巧\n\n- 设定具体目标：明确今天要完成的任务。\n- 番茄工作法：25分钟专注，5分钟休息。\n- 主动回忆与间隔重复：用检索而非重读。\n- 输出驱动：用讲解或写作检验理解。\n- 及时复盘：记录问题与改进点。\n\n> 学习不是时间的堆砌，而是效率的提升。\n\n## 快速行动清单\n- 今天的目标写下来\n- 安排2个番茄钟\n- 用问题自测一次\n- 输出一段总结\n- 晚上做5分钟复盘\n",
  "theme": "清新自然",
  "type": "standard"
}

响应

{
  "html": "\n      <!DOCTYPE html>\n      <html lang="zh-CN">\n      <head>\n        <meta charset="UTF-8">\n        <meta name="viewport" content="width=device-width, initial-scale=1.0">\n        <style>\n          \n          .card {\n            background: linear-gradient(135deg, #e8f5e8 0%, #c8e6c9 100%);\n            border: 1px solid #81c784;\n            border-radius: 10px;\n            padding: 20px;\n            box-shadow: 0 4px 8px rgba(129, 199, 132, 0.3);\n            font-family: 'Open Sans', sans-serif;\n            color: #2e7d32;\n          }\n        \n          .card-content {\n            margin: 0;\n            padding: 0;\n          }\n        </style>\n      </head>\n      <body>\n        <div class="card">\n          <div class="card-content"><h1>高效学习的五个技巧</h1>\n<ul>\n<li>设定具体目标：明确今天要完成的任务。</li>\n<li>番茄工作法：25分钟专注，5分钟休息。</li>\n<li>主动回忆与间隔重复：用检索而非重读。</li>\n<li>输出驱动：用讲解或写作检验理解。</li>\n<li>及时复盘：记录问题与改进点。</li>\n</ul>\n<blockquote>\n<p>学习不是时间的堆砌，而是效率的提升。</p>\n</blockquote>\n<h2>快速行动清单</h2>\n<ul>\n<li>今天的目标写下来</li>\n<li>安排2个番茄钟</li>\n<li>用问题自测一次</li>\n<li>输出一段总结</li>\n<li>晚上做5分钟复盘</li>\n</ul>\n</div>\n        </div>\n      </body>\n      </html>\n    ",
  "css": "\n          .card {\n            background: linear-gradient(135deg, #e8f5e8 0%, #c8e6c9 100%);\n            border: 1px solid #81c784;\n            border-radius: 10px;\n            padding: 20px;\n            box-shadow: 0 4px 8px rgba(129, 199, 132, 0.3);\n            font-family: 'Open Sans', sans-serif;\n            color: #2e7d32;\n          }\n        ",
  "metadata": {
    "theme": "清新自然",
    "type": "standard",
    "wordCount": 26,
    "charCount": 197
  }
}
没有实际的输出转换为知识卡片例如一张图片png格式等，保存在当前文件夹，我要的时实际的实现，而不是一个架子