본문으로 건너뛰기
cccskills
무료GitHub에 공개

web-to-app

Package a website URL as a desktop application for macOS, Windows, or Linux using pake-cli. Customize its name, icon, window size, and advanced options, then receive the installer file and installation guidance.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

원문원문 설명 보기

网页开发工程师当需要将任意网页URL封装为独立桌面客户端时,使用此技能可一键生成体积仅约5MB的跨平台(Win/Mac/Linux)原生应用安装包。支持自定义图标与高级配置,助你快速交付轻量级桌面端产品。

설치 방법 보기

이럴 때 유용합니다

  • Turn a frequently used website into a desktop app
  • Customize an app’s icon and window size
  • Create an installer for the target platform
  • Configure multiple instances or a hidden title bar

포함된 파일(4)

  • SKILL.md5.0 KB
  • references/parameter-guide.md9.3 KB
  • scripts/build_app.py7.8 KB
  • scripts/install_pake.py3.3 KB

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

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)
  • 当需要高级配置:

  • 当打包失败:

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

资源索引

必要脚本

  • scripts/install_pake.py

    • 用途:检查并安装 pake-cli 工具
    • 参数:无
    • 返回:安装状态和版本信息
  • scripts/build_app.py

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

领域参考

注意事项

  • ⏰ 首次打包较慢:需要下载和编译 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"
    }
)

快捷键说明

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

操作macOSWindows/Linux
刷新页面⌘ + RCtrl + R
隐藏窗口⌘ + WCtrl + W
放大/缩小⌘ + +/-Ctrl + +/-
重置缩放⌘ + 0Ctrl + 0
复制 URL⌘ + LCtrl + L
返回首页⌘ + Shift + HCtrl + Shift + H
开发者工具⌘ + Option + ICtrl + Shift + I(仅调试模式)
清除缓存重启⌘ + Shift + DeleteCtrl + Shift + Delete

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

Organize AI agents into execution, management, and review roles for complex projects. Choose preset or custom teams, share project context and decisions, and combine their discussions and work into meeting records, feasibility reports, or implementation outputs.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Reviewing a technical architecture from several perspectives
  • Discussing product pricing across market and cost considerations
  • Assessing a new product's feasibility
anbeime/skill8.3천2026년 10월 18일 업데이트

Generate character images, backgrounds, synthetic speech, and music for product videos featuring 小省导购员, a digital shopping presenter. Coordinate these assets with InfiniteTalk to produce a 25-second vertical video made from five scenes.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Producing a 25-second vertical product presentation video
  • Generating reference images for the 小省导购员 character
  • Creating business setting backgrounds for a video
anbeime/skill8.3천2026년 10월 18일 업데이트

Convert PDF, Word, and Excel documents into structured Markdown for search and knowledge bases. The skill tries three parsers in sequence when needed and returns metadata, a confidence score, and the parser used.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Prepare documents for retrieval-augmented generation
  • Structure documents for an internal knowledge base
  • Extract structured text from contracts
anbeime/skill8.3천2026년 10월 18일 업데이트

Organize parsed documents into four color-coded cards covering facts, explanations, risks, and actions. Preserve source references and generation details so readers can review evidence, identify uncertainty, and consider next steps in research, financial, or legal analysis.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Separating facts from interpretations in financial reports
  • Organizing evidence and risks in legal documents
  • Turning research documents into evidence-linked analysis cards
anbeime/skill8.3천2026년 10월 18일 업데이트

Record operations across multiple AI agents and connect events into a traceable history. Search records by tracking ID, time window, or responsible component to support audits and investigations, with local storage available when the vector database fails.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Trace task dispatch and execution across agents
  • Search audit records by time or responsible component
  • Keep recording events during vector database failures
anbeime/skill8.3천2026년 10월 18일 업데이트

Screen documents and external URLs before they enter a processing workflow. Check blocked domains and document permissions, then produce a pass or reject decision, a risk report, and a tracking ID for later review.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Screening documents before adding them to a knowledge base
  • Checking external URLs against a domain blocklist
  • Reviewing document permissions before processing
anbeime/skill8.3천2026년 10월 18일 업데이트

anbeime의 스킬 모두 보기

이 스킬의 문제 신고