mcpField
U
url-to-markdown

url-to-markdown

github.com/zlh-428ドキュメント736 回インストール39 週間前に更新
リポジトリ

url-to-markdown について

URL to Markdownは、Chrome CDPでウェブページを取得し、レンダリング済みHTMLをページメタデータ付きのMarkdownに変換します。公開ページや操作が必要なページ向けに、自動取得とユーザー操作を待つモードを備えています。

主な機能

  1. 01Chrome CDPによるJavaScript描画ページの取得
  2. 02自動取得とユーザー操作待ちモード
  3. 03ページメタデータ付きMarkdown出力
  4. 04出力先とタイムアウトの設定
  5. 05ドメイン別の取得ファイル整理

活用シーン

  1. 01公開ページをMarkdownとして保存
  2. 02ログインやスクロール後にページを取得
  3. 03動的に描画されるページの内容を抽出

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/zlh-428/naruto-skills --skill url-to-markdown

インストール後、Claude Code で/url-to-markdownを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

scripts/
cdp.ts
constants.ts
html-to-markdown.ts
main.ts
paths.ts

詳細

URL から Markdown へ

Chrome CDP を介して任意の URL を取得し、HTML をクリーンな Markdown に変換します。

スクリプトディレクトリ

重要：すべてのスクリプトは、このスキルの scripts/ サブディレクトリにあります。

エージェントの実行手順：

  1. この SKILL.md ファイルのディレクトリパスを SKILL_DIR として特定します
  2. スクリプトパス = ${SKILL_DIR}/scripts/<script-name>.ts
  3. このドキュメント内のすべての ${SKILL_DIR} を実際のパスに置き換えます

スクリプトの参照：

スクリプト用途
scripts/main.tsURL 取得用の CLI エントリーポイント

機能

  • JavaScript を完全にレンダリングする Chrome CDP
  • 2 つの取得モード：自動またはユーザー待機
  • メタデータ付きのクリーンな Markdown 出力
  • 待機モードでログインが必要なページに対応

使い方

# Auto mode (default) - capture when page loads
npx -y bun ${SKILL_DIR}/scripts/main.ts <url>

# Wait mode - wait for user signal before capture
npx -y bun ${SKILL_DIR}/scripts/main.ts <url> --wait

# Save to specific file
npx -y bun ${SKILL_DIR}/scripts/main.ts <url> -o output.md

オプション

オプション説明
<url>取得する URL
-o <path>出力ファイルのパス（デフォルト：自動生成）
--wait取得前にユーザーの合図を待ちます
--timeout <ms>ページの読み込みタイムアウト（デフォルト：30000）

取得モード

自動モード（デフォルト）

ページを読み込み → ネットワークがアイドル状態になるまで待機 → すぐに取得します。

次の場合に最適です：

  • 公開ページ
  • 静的コンテンツ
  • ログインが不要
待機モード（--wait）

ページを開く → ユーザーが操作できます（ログイン、スクロールなど）→ ユーザーが準備完了を通知 → 取得します。

次の場合に最適です：

  • ログインが必要なページ
  • 操作が必要な動的コンテンツ
  • 遅延読み込みのあるページ

待機モードでのエージェントのワークフロー：

  1. --wait フラグを付けてスクリプトを実行します
  2. スクリプトが次のように出力します：Page opened. Press Enter when ready to capture...
  3. AskUserQuestion を使って、ページの準備ができたかユーザーに尋ねます
  4. ユーザーが確認したら、取得を開始するために標準入力へ改行を送信します

出力形式

---
url: https://example.com/page
title: "Page Title"
description: "Meta description if available"
author: "Author if available"
published: "2024-01-01"
captured_at: "2024-01-15T10:30:00Z"
---

# Page Title

Converted markdown content...

モード選択ガイド

ユーザーが URL の取得を依頼した場合は、適切なモードの選択を支援してください。

自動モードを提案する場合：

  • URL が公開されている（ログイン画面が表示されない）
  • コンテンツが静的に見える
  • ユーザーがログインの必要性に言及していない

待機モードを提案する場合：

  • ユーザーがログインの必要性に言及している
  • 認証が必要なサイトであることが知られている
  • ユーザーが取得前にスクロールや操作をしたい
  • コンテンツがペイウォールの内側にある

不明な場合はユーザーに尋ねます：

The page may require login or interaction before capturing.

Which mode should I use?
1. Auto - Capture immediately when loaded
2. Wait - Wait for you to interact first

出力ディレクトリ

取得するたびに、ドメインごとに整理されたファイルが作成されます。

url-to-markdown/
└── <domain>/
    └── <slug>.md

パスの構成要素：

  • <domain>：サイトのドメイン（例：example.com、github.com）
  • <slug>：ページタイトルまたは URL パスから生成（ケバブケース）

スラッグの生成：

  1. ページタイトル（優先）または URL パスから抽出します
  2. 2～6 語のケバブケースに変換します
  3. 例：「Getting Started with React」→ getting-started-with-react

競合の解決： url-to-markdown/<domain>/<slug>.md がすでに存在する場合：

  • タイムスタンプを追加します：<slug>-YYYYMMDD-HHMMSS.md
  • 例：getting-started.md が存在する → getting-started-20260118-143052.md

エラー処理

エラー解決方法
Chrome が見つからないChrome をインストールするか、URL_CHROME_PATH env を設定します
ページのタイムアウト--timeout の値を増やします
取得に失敗複雑なページでは待機モードを試します
コンテンツが空JavaScript のレンダリングに時間が必要なページの可能性があります

環境変数

変数説明
URL_CHROME_PATHカスタム Chrome 実行ファイルのパス
URL_DATA_DIRカスタムデータディレクトリ
URL_CHROME_PROFILE_DIRカスタム Chrome プロファイルディレクトリ

拡張機能のサポート

EXTEND.md を使用してカスタム設定を行えます。

パスの確認（優先順位順）：

  1. .content-gen-skills/url-to-markdown/EXTEND.md（プロジェクト）
  2. ~/.content-gen-skills/url-to-markdown/EXTEND.md（ユーザー）

見つかった場合は、ワークフローの前に読み込みます。拡張コンテンツはデフォルト設定を上書きします。

コメント

Markdown 対応