A tool that previews Markdown product documents in a web browser and refreshes the view when the documents change. Markdown is a plain-text format commonly used for project documentation.

Use it to preview files in the docs folder, including product requirements, design, growth, risk, and strategy documents.

It makes it easier to inspect the rendered layout of requirements and other product documents without repeatedly refreshing or converting them by hand.

pm-preview — Skill for Claude Code by konglong87/superPM

Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

Any agent

npx skills add konglong87/superPM --skill pm-preview

Clone the repo

git clone --depth 1 https://github.com/konglong87/superPM

Made for: Claude Code.

Or install super-pm, the plugin that ships this one along with the rest of its 57 skills, 1 hook.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

README.md

[![agentmods](https://agentmods.dev/badge/skills/konglong87/superpm/pm-preview/github.svg)](https://agentmods.dev/skills/konglong87/superpm/pm-preview)

Your own site

<a href="https://agentmods.dev/skills/konglong87/superpm/pm-preview"><img src="https://agentmods.dev/badge/skills/konglong87/superpm/pm-preview/github.svg" alt="Measured on agentmods" height="20"></a>

Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.

Your own site · 80×15

<a href="https://agentmods.dev/skills/konglong87/superpm/pm-preview"><img src="https://agentmods.dev/badge/skills/konglong87/superpm/pm-preview.svg" alt="Reviewed on agentmods" width="80" height="20"></a>

Per session 77 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.

When invoked 1,280 The whole file, excluding the scripts and references it only reads on demand.

Security scan A 0 findings. A grade says what 26 rules found in the file — not that it is safe. Third-party audits

NVIDIA SkillSpector pass 7 Sept 2026

How audits are shown

Origin original No closer match found in the catalogue.

Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

Model	Per session	Once invoked
Fable 5.1	$0.00077	$0.01280
Opus 5.5	$0.00031	$0.00512
Sonnet 5.5	$0.00015	$0.00256
Haiku 4.5	$0.00008	$0.00128

Measured 26d ago against content hash 99d19dc70343, method: parsed. Prices are Anthropic first-party input rates as of 2026-10-07, from the pricing page.

Security

Grade A, and why

pm-preview scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 26d ago.

The scan reads SKILL.md. This mod also ships 6 executable files (scripts/preview-helper.js, scripts/preview-server.cjs, scripts/start-preview.sh, …), listed below but not scanned — reading those needs a real analyzer, not pattern matching.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

skills/pm-preview/SKILL.md · 135 lines

How it starts

The opening of the file, as written. The whole thing — 135 lines — stays where its author put it; the contents beside it link to each section on GitHub.

Preamble (run first)

# 检查 docs/ 目录和文档数量
echo "📊 文档预览状态："
echo ""

if [ ! -d docs ]; then
  echo "  ❌ docs/ 目录不存在"
  echo "  💡 请先执行产品流程（/pm-brainstorm → /pm-demand → ... → /pm-docs）生成文档"
  exit 0
fi

total=0
for prefix in "01-需求调研" "02-方案设计" "03-增长迭代" "04-风控管理" "05-产品战略"; do
  count=$(ls docs/$prefix/*.md 2>/dev/null | wc -l | tr -d ' ')
  if [ "$count" -gt 0 ]; then
    echo "  $prefix: $count 个文档"
    total=$((total + count))
  fi
done

# 递归统计所有 .md 文件
all=$(find docs -name "*.md" 2>/dev/null | wc -l | tr -d ' ')
echo ""
echo "  📄 总计: $all 个 MD 文档"
echo ""

if [ "$all" -eq 0 ]; then
  echo "  ❌ 没有找到任何文档"
  echo "  💡 请先执行产品流程生成文档"
fi

执行流程

步骤 1: 启动预览服务器

先从已加载的本 skill 路径确定其绝对目录（单独安装时不在项目的 skills/ 目录内），再使用 Bash 启动：

bash "<当前 pm-preview skill 所在目录>/scripts/start-preview.sh" --project-dir .

说明：

服务器在随机高端口启动（49152-65535）
使用 --project-dir . 将 session 持久化到 .superpm/preview/，服务器停止后文件保留；验收完毕后应删除不再需要的 session
后台运行，不阻塞终端

输出示例：

{"type":"server-started","port":52341,"url":"http://localhost:52341","docs_dir":"/path/to/docs","state_dir":"/path/to/.superpm/preview/..."}

步骤 2: 告知用户打开预览

从输出中提取 url 字段，告知用户：

📄 文档预览已启动！

🌐 预览地址: {url}

在浏览器中打开上述地址，即可查看所有产品文档。

左侧边栏：文档目录树

右侧内容区：Markdown 渲染结果

📝 文档更新时浏览器会自动刷新

步骤 3: 监控状态（可选）

如果用户需要持续预览，可以提醒：

💡 提示：

预览服务器 30 分钟无活动后自动停止

如需手动停止，执行：bash "<当前 pm-preview skill 所在目录>/scripts/stop-preview.sh" .superpm/preview/{session_id}

执行其他 skill（如 /pm-docs）生成新文档后，浏览器会自动刷新

停止预览

用户可通过以下方式停止：

# 查找 session 目录
ls -d .superpm/preview/*/

# 停止服务器
bash "<当前 pm-preview skill 所在目录>/scripts/stop-preview.sh" .superpm/preview/{session_id}

功能特性

特性	说明
实时刷新	文档更新时通过 WebSocket 自动推送刷新
侧边栏导航	按目录分组展示所有文档，支持折叠/展开
Markdown 渲染	浏览器端渲染，支持表格、代码块、流程图
亮/暗主题	跟随操作系统主题自动切换
零依赖	仅使用 Node.js 内置模块，无需 npm install
自动清理	30 分钟无活动自动停止，/tmp 下临时文件自动删除

注意事项

首次使用：确保 docs/ 目录下有至少一个 .md 文件
浏览器兼容：需要支持 WebSocket 的现代浏览器（Chrome/Firefox/Safari/Edge）
网络要求：Markdown 渲染和 HTML 清理库随 skill 本地提供，预览不依赖 CDN；需要本地 Node.js
端口冲突：如果随机端口被占用，服务器会自动使用其他端口
多会话：每次启动创建独立 session，可同时运行多个预览实例

Read the full file on GitHub · 135 lines

Files

What ships with it

9 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

26d ago Changed 99d19dc70343
1mo ago First seen · 135 lines · 77 tokens per session scan A 81376b8c8eae

Subscribe to this mod's changes

pm-preview is a skill published in the GitHub repository konglong87/superPM (77 stars, last pushed 7d ago), licensed MIT. It adds 77 tokens to every session and 1,280 once invoked, about $0.0003 per session on Opus 5.5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.

Browser automation Documents claude claude-skills openclaw openclaw-skill openclaw-skills pm-skills

baoyu-url-to-markdown

Fetch any URL and convert to markdown using baoyu-fetch CLI (Chrome CDP with site-specific adapters). Built-in adapters for X/Twitter, YouTube transcripts, Hacker News threads, and generic pages via Defuddle. Handles login/CAPTCHA via interaction wait modes. Use when user wants to save a webpage as markdown.

JimLiu/baoyu-skills · 72 tokens

pm-preview