Web to App

任务目标

• •本 Skill 用于：将任意网页 URL 打包成原生桌面应用
• •能力包含：
  1. •自动检测并安装 pake-cli 工具
  2. •支持自定义应用名称、图标、窗口尺寸等配置
  3. •生成 macOS/Windows/Linux 平台的应用安装包
  4. •支持高级配置（隐藏标题栏、多实例、代理等）
• •触发条件：用户提出"将网页打包成应用"、"制作桌面应用"等需求

前置准备

环境要求

• •Node.js：版本 ≥ 18.0.0（推荐 22.0+）
• •Rust：≥ 1.85.0（首次使用会自动安装）
• •系统工具：
  • •macOS/Linux：需要 curl、wget、file、tar
  • •Windows：自动处理依赖

安装依赖

首次使用前，需要安装 pake-cli 工具：

npm install -g pake-cli
# 或使用 pnpm（推荐）
pnpm install -g pake-cli

操作步骤

标准流程

1. •

   收集需求

   • •确认网页 URL（必需）
   • •应用名称（建议英文）
   • •目标平台（自动检测当前系统）
   • •自定义需求（图标、窗口大小等）
2. •

   环境准备

   • •调用 scripts/install_pake.py 检查并安装 pake-cli
   • •验证 Node.js 和 Rust 环境
3. •

   执行打包

   • •根据用户需求生成配置参数
   • •调用 scripts/build_app.py 执行打包
   • •监控执行进度和错误信息
4. •

   输出验证

   • •确认生成的应用安装包
   • •提供安装和使用说明

可选分支

• •

  当需要自定义图标：

  • •提供图标文件路径（支持本地或远程 URL）
  • •自动转换为平台特定格式（.icns/.ico/.png）
• •

  当需要高级配置：

  • •参考 references/parameter-guide.md
  • •添加对应参数（如 --hide-title-bar、--multi-instance）
• •

  当打包失败：

  • •检查网络连接（需要下载依赖）
  • •验证 Node.js 和 Rust 版本
  • •使用 --debug 参数查看详细日志

资源索引

必要脚本

• •

  scripts/install_pake.py

  • •用途：检查并安装 pake-cli 工具
  • •参数：无
  • •返回：安装状态和版本信息
• •

  scripts/build_app.py

  • •用途：执行网页打包命令
  • •参数：
    • •url：网页 URL（必需）
    • •name：应用名称
    • •icon：图标路径
    • •width：窗口宽度
    • •height：窗口高度
    • •options：其他可选参数（字典格式）
  • •返回：生成的应用文件路径

领域参考

• •references/parameter-guide.md
  • •何时读取：需要配置高级选项时
  • •内容：完整的参数说明和使用示例

注意事项

• •⏰ 首次打包较慢：需要下载和编译 Rust 依赖，后续打包会快很多
• •📦 输出位置：默认在当前工作目录（./）生成应用安装包
• •🖥️ 平台适配：
  • •macOS：生成 .dmg 安装包（设置 PAKE_CREATE_APP=1 可生成 .app）
  • •Windows：生成 .msi 安装包
  • •Linux：生成 .deb 或 .AppImage 包
• •🚀 调试模式：遇到问题时添加 --debug 参数查看详细日志
• •🔐 证书问题：如果是内网或自签名证书，使用 --ignore-certificate-errors

使用示例

示例 1：基础打包

功能说明：将 GitHub 网页打包成应用 执行方式：脚本调用

from scripts.build_app import build_app

result = build_app(
    url="https://github.com",
    name="GitHub"
)
# 输出：GitHub.dmg / GitHub_x64.msi / GitHub_x86_64.deb

示例 2：自定义配置

功能说明：自定义窗口大小和图标 执行方式：脚本调用

result = build_app(
    url="https://chat.openai.com",
    name="ChatGPT",
    icon="https://example.com/icon.png",
    width=1400,
    height=900,
    options={
        "hide-title-bar": True,
        "always-on-top": False
    }
)

示例 3：多实例应用

功能说明：允许同时打开多个应用窗口 执行方式：脚本调用

result = build_app(
    url="https://example.com",
    name="MyApp",
    options={
        "multi-instance": True,
        "activation-shortcut": "CmdOrControl+Shift+P"
    }
)

快捷键说明

生成的应用内置以下快捷键：