Web To Ios MCP

Web到iOS MCP

MCP服务器，用于使用Capacitor将web应用程序（Vite/Next.js/React）转换为iOS应用程序。

概要

Web到iOS MCP 是现有的Web应用程序iOS为了转换成应用程序MCP服务器。Vite、Next.js、Create React App等框架Capacitor使用iOS自动生成化的详细规格书和配置文件。

主要功能

🔍 1.框架自动检测

• 快速+反应/查看: package.json和vite.config.ts的明细栏样式中定义的设置
• Next.js: App Router / Pages Router发现
• 创建React应用程序: react-scripts发现
• 其他: Parcel, Webpack等

検出内容：

• 框架名称和版本
• 构建输出目录
• 路由选择
• 正在使用的主要库（React Router、Supabase等）

📝 2. iOS变换仕样书の自动生成

根据项目配置生成详细的规格书，包括：

• 当前技术栈分析
• Capacitor安装说明
• 特定于框架的设置更改（按Vite/NNext.js）
• capacitor.config.ts 建议
• package.json 添加到脚本
• iOS固有の最适化（Safe Area、Status Bar等）
• 故障排除指南

⚙️ 3.自动生成配置文件

• capacitor.config.ts：为项目优化的设置
• 构建设置更改建议
• .gitignore 附加项

✅ 4.迁移准备核对表

• Xcode确认环境
• CocoaPods安装状态
• 确认所需的依赖关系
• 确认构建成功

用法

MCP资源

这MCP服务器将以下文档MCP作为资源提供。Claude Code对较大场景进行渲染期间已观察到该故障。

web-to-ios://guides/implementation

实施指南 - iOS迁移实施指南

提供完整的实施指南：

• 实施前的问题整理和风险管理
• 设计原则（KISS、YAGNI、Fail Fast等）
• 性能优化最佳实践
• 质量检查表
• MVP（Minimum Viable Product）定义

web-to-ios://guides/troubleshooting

常见问题及解决方案 -故障排除指南

包括常见问题和解决方案：

• 构建错误（CocoaPods、Xcode签名等）
• 运行时错误（白色屏幕、路由、环境变量）
• Vite特有の问题（base设定、HMR等）
• Next.js特有の问题（Static Export、画像最适化等）
• Supabase协作问题
• UI/UX问题（Safe Area、状态栏、键盘）
• 性能问题

MCP工具

detect_web_framework

Web检测项目的框架和配置。

入力:

• projectPath：项目目录路径

出力:

{
  "framework": "vite",
  "version": "5.0.0",
  "uiLibrary": "react",
  "buildOutputDir": "dist",
  "routing": "react-router",
  "dependencies": {
    "supabase": "^2.78.0",
    "tailwindcss": "^3.4.0"
  }
}

generate_ios_migration_spec

iOS生成用于转换的详细规格说明书。

入力:

• projectPath：项目目录路径
• appName：应用程序名称（例如“Spark Vault”）
• bundleId：捆绑包ID（例如：“com.ogadix.sparkvault”）

出力:

• Markdown形式的详细式样书

generate_capacitor_config

Capacitor生成配置文件。

入力:

• appName：应用程序名称
• appId：捆绑ID
• webDir：构建输出目录（例如“dist”）
• framework：框架名称（例如“vite”）

出力:

• capacitor.config.ts 文件内容

analyze_migration_readiness

iOS检查迁移的就绪性。

入力:

• projectPath：项目目录路径

出力:

{
  "ready": false,
  "checks": [
    { "name": "Xcode installed", "status": "pass" },
    { "name": "CocoaPods installed", "status": "pass" },
    { "name": "Build successful", "status": "fail", "message": "npm run build failed" }
  ]
}

支持的框架

✅ 已对应（v1.0）

• Vite+反应
• 快速+查看
• Next.js （应用路由器/页面路由器）
• 创建React应用程序

🔜 今后对应予定

• 星的
• SvelteKit 的
• 混音
• Nuxt.js

技术栈

• TypeScript: 型安全性
• Node.js：実行环境
• MCP-SDK: @modelcontextprotocol/sdk
• 从属库:

- fs-extra：文件操作 - glob：文件搜索 - JSON/YAML 解析器

安装

# NPMで公開後
npm install -g web-to-ios-mcp

# または、ローカル開発
git clone https://github.com/Gaku52/web-to-ios-mcp.git
cd web-to-ios-mcp
npm install
npm run build

开发路线图

Phase 1: 基本机能（v1.0）

• \[x\] 项目构想及规格制定
• \[\]框架检测功能

- \[ \] Vite検出 - \[ \] Next.js検出 - \[ \] CRA検出

• \[ \] iOS仕样书生成

- \[ \] Vite的模板 - \[ \] Next.js的模板

• \[ \] Capacitor设定生成
• \[\]迁移准备检查
• \[\]创建测试用例
• \[\]文档维护

Phase 2: 扩张机能（v1.1+）

• \[\]更详细的依存关系分析
• \[\]自定义插件推荐功能
• \[\]故障诊断自动诊断
• \[\]现有iOS项目发现和更新

Phase 3: Android対応（v2.0）

• 将显示 web-to-mobile-mcp 变更复核
• \[ \] Android变换机能追加
• \[ \] iOS/Android共通设定の最适化

分发

欢迎分享！

1. 分叉存储库
2. 创建功能分支(git checkout -b feature/amazing-feature)
3. 提交您的更改(git commit -m 'Add some amazing feature')
4. 推到分支(git push origin feature/amazing-feature)
5. 打开拉取请求

许可证

MIT License - 详情 许可证 的双曲正切值

作者

学术论文52

相关项目

• Spark保险库 -这个MCP来修改标记元素的显示属性iOS化预定的想法管理应用程序
• 电容器 - Web to Native变换器

______________________________________________________________________

Web to iOS MCP 那么，你的Web简化应用程序iOS到应用程序。