AI导哈

Web转iOS转换工具

一个将Web应用程序（如Vite/Next.js/React）转换为iOS应用的MCP服务器，支持自动检测框架并生成详细规格和配置文件。

  • by Gaku52
  • TypeScript
  • 本地部署
  • 1 星标
  • 更新于
在 GitHub 查看 Gaku52/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到应用程序。

相关 MCP