mcpField
E
export-standalone

export-standalone

github.com/bluzir开发10745 次安装27 周前更新
代码仓库

关于 export-standalone

用于将 HTML 页面导出为可离线使用的单文件技能，借助 Rust 命令行工具 monolith 内嵌页面资源，并通过隔离选项阻止导出后加载远程资源。

主要功能

  1. 01将页面资源内嵌到单个 HTML
  2. 02使用 monolith 命令行处理
  3. 03隔离导出文件的远程资源加载
  4. 04移除元数据
  5. 05报告输出文件大小

适用场景

  1. 01制作可通过邮件或聊天分享的离线页面
  2. 02归档不依赖 CDN 的 HTML 文件

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/bluzir/claude-code-design --skill export-standalone

安装后在 Claude Code 中输入/export-standalone确认已加载。

详细介绍

导出为独立文件

生成一个可离线运行的单个 HTML 文件（无外部依赖）。使用 monolith——一个会内联所有内容的 Rust CLI。

预检

  1. Bash(which monolith) — 检查是否已安装。如果未安装：
    • 告诉用户：未找到 monolith。请使用 brew install monolith 安装（macOS），然后重新运行。
    • 停止。

步骤

  1. 解析路径：

    • $0 = 输入 HTML（必需）
    • $1 = 输出 HTML（默认：<input>-standalone.html）
    • 如有需要，运行 Bash(mkdir -p $(dirname <output>))

  2. 运行 monolith：

    Bash(monolith "<input>" --isolate --no-metadata -o "<output>")

    标志：

    • --isolate — 设置 CSP，以防止打包后加载任何远程资源
    • --no-metadata — 移除 `` 元数据

  3. 报告：

    • 使用 Bash(stat -f%z "<output>") 或 Bash(ls -la "<output>") 获取文件大小
    • “已将 <input> 打包为 <output>（<size> KB）。可离线运行。”

权衡

  • 优点：单个文件，可直接放入邮件/聊天中，无需依赖 CDN，可长期存档
  • 缺点：文件更大（原始大小的 5-10 倍），不支持 HMR，字体通常会以内联 base64 的形式嵌入（文件更大）
  • 保留交互功能（React + Babel 仍会在加载时运行），但网络请求会按设计失败

评论

支持 Markdown