MCP Server & VSCode Extension
2025.04.03
0
JavaScriptWeb 开发AI 生成代码VSCode 扩展开发效率内容生成
Mcp-server-createanyhtmlapp 是一个基于 MCP（Model-Controlled Programming）技术的服务器和 VSCode 扩展，旨在帮助开发者通过简单的自然语言提示快速生成完整的 HTML、CSS 和 JavaScript 应用程序。该服务利用 Google 的 LLM（大型语言模型）提供高质量的 AI 生成代码，并与 VSCode 无缝集成，提升开发体验。
View on GitHub
Overview
基本能力
产品定位
Mcp-server-createanyhtmlapp 是一个面向开发者的工具，旨在通过自然语言提示快速生成 Web 应用程序代码，提升开发效率。
核心功能
- 自然语言生成代码：通过简单的自然语言提示生成完整的 HTML、CSS 和 JavaScript 应用程序。
- VSCode 集成：提供 VSCode 扩展，直接在开发环境中使用。
- AI 驱动：利用 Google 的 LLM 技术生成高质量的代码。
- 动态代码生成：MCP Server 作为后端处理提示并动态生成代码。
适用场景
- 快速原型开发：开发者可以通过自然语言快速生成 Web 应用程序原型。
- 教学与学习：初学者可以通过自然语言学习 Web 开发的基础知识。
- 自动化开发：减少重复性编码工作，提升开发效率。
工具列表
- MCP Server：后端服务，处理自然语言提示并生成代码。
- VSCode 扩展：前端工具，提供与 VSCode 的无缝集成。
常见问题解答
- 如何确保生成的代码质量？
- 该服务利用 Google 的 LLM 技术，生成的代码质量较高，但仍需开发者手动检查和优化。
- 是否需要联网？
- 是的，该服务需要联网以调用 Google 的 LLM 服务。
- 是否支持其他编辑器？
- 目前仅支持 VSCode，未来可能会扩展支持其他编辑器。
使用教程
使用依赖
- 确保已安装 Node.js 和 npm。
- 确保已安装 VSCode。
安装教程
MCP Server
- 克隆仓库：
sh git clone https://github.com/your-username/mcp-server-vscode-extension.git - 进入服务器目录：
sh cd mcp-server - 安装依赖：
sh npm install - 启动服务器：
sh npm start
VSCode 扩展
- 进入扩展目录：
sh cd vscode-extension - 安装依赖：
sh npm install - 编译扩展：
sh npm run compile - 在 VSCode 中打开
Run and Debug标签并启动扩展。
调试方式
- 确保 MCP Server 正在运行。
- 在 VSCode 中使用命令面板（
Ctrl+Shift+P/Cmd+Shift+P）选择 "Create App with Prompt"。 - 输入描述应用程序的自然语言提示。
- 扩展将自动生成并打开相关文件。
- 在浏览器中预览应用程序并根据需要进行修改。