web-to-markdown について
web-to-markdownは、ローカルブラウザーからweb2mdを実行し、ウェブページを整ったMarkdownに変換するスキルです。JavaScriptで描画されるページにも対応し、本文抽出やリンク整理、YAML frontmatterの追加ができます。
主な機能
- 01ページをMarkdownに変換
- 02JavaScript描画ページに対応
- 03Readabilityで本文を抽出
- 04Turndownでリンクを整理
- 05YAML frontmatterを任意で追加
- 06標準出力またはファイルに保存
活用シーン
- 01ウェブ記事をMarkdownで保存
- 02動的に描画されるページの変換
- 03複数URLの一括変換
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/ / github.com/ softaworks/ agent-toolkit --skill web-to-markdownインストール後、Claude Code で/web-to-markdownを入力して読み込まれたか確認します。
同梱ファイルREADME.md
詳細
web-to-markdown
ローカルにインストールされたブラウザーを操作して(web2md 経由で)、ウェブページを読みやすい Markdown に変換します。
厳格な起動条件(必ず適用)
ユーザーが次のようなフレーズをそのまま明示的に記述していない限り、このスキルを使用してはいけません。
use the skill web-to-markdown ...use a skill web-to-markdown ...
ユーザーがこのスキルを名前で明示的にリクエストしていない場合は、処理を中止し、use the skill web-to-markdown を含めてリクエストを再送するよう依頼してください。
このスキルの機能
- JavaScript で描画されるページに対応します(Puppeteer → ユーザーの Chrome)。
puppeteer-core経由で Chromium 系ブラウザー(Chrome/Chromium/Brave/Edge)を使用する場合に最適です。- メインコンテンツを抽出します(Readability)。
- リンクを整えて Markdown に変換し、必要に応じて YAML フロントマターを追加します(Turndown)。
対象外
- Playwright やその他のブラウザー自動化スタックは使用しないでください。使用する仕組みは
web2mdです。
収集する入力(不足している場合のみ質問)
url(または URL のリスト)- 出力方法:
- 標準出力に表示(
--print)、または - ファイルに保存(
--out ./file.md)、または - ディレクトリに保存(ページタイトルを使って自動命名する場合は
--out ./some-dir/)
- 標準出力に表示(
- ページの表示に問題がある場合のオプション設定:
--chrome-path <path>(Chrome の自動検出に失敗する場合)--interactive(Chrome を表示して一時停止します。ユーザーが本人確認やログインを完了した後、Enter キーを押します)--wait-until load|domcontentloaded|networkidle0|networkidle2--wait-for '<css selector>'--wait-ms <milliseconds>--headful(デバッグ用)--no-sandbox(コンテナーや CI では必要になる場合があります)--user-data-dir <dir>(ログイン/セッション用。専用のプロファイルディレクトリを使用してください)
ワークフロー
- ユーザーがスキルを明示的に起動したことを確認します(
use the skill web-to-markdown)。 - URL が
http://またはhttps://で始まることを確認します。 web2mdがインストールされていることを確認します。- 実行:
command -v web2md - 見つからない場合は、インストールするようユーザーに案内します(プロジェクトは
~/workspace/softaworks/projects/web2mdにあるものとします)。cd ~/workspace/softaworks/projects/web2md && npm install && npm run build && npm link- または
cd ~/workspace/softaworks/projects/web2md && npm install && npm run build && npm install -g .
- 実行:
- 変換します。
- 単一 URL → ファイル:
web2md '<url>' --out ./page.md
- 単一 URL → ディレクトリ内に自動命名したファイル:
mkdir -p ./out && web2md '<url>' --out ./out/
- 人による確認/ログインが必要な場合(対話モード):
mkdir -p ./out && web2md '<url>' --interactive --user-data-dir ./tmp/web2md-profile --out ./out/- 続いて、ブラウザーウィンドウで確認を完了し、ターミナルで Enter キーを押して続行します。
- 標準出力に表示:
web2md '<url>' --print
- 複数 URL(バッチ処理):
- 出力ディレクトリ(例:
./out/)を作成し、URL ごとに--out ./out/を指定してweb2mdコマンドを実行します。
- 出力ディレクトリ(例:
- 単一 URL → ファイル:
- 出力を確認します。
- ファイルに書き込む場合は、ファイルが存在し、空でないことを確認します(例:
ls -la <path>およびwc -c <path>)。
- ファイルに書き込む場合は、ファイルが存在し、空でないことを確認します(例:
- 返却します。
- 保存したファイルのパス、または Markdown(標準出力モードの場合)。
デフォルト設定(推奨)
- ほとんどのページでは、
--wait-until networkidle2を使用します。 - 重いアプリでは、まず
--wait-until domcontentloaded --wait-ms 2000を指定し、必要に応じて--wait-for 'main'(または別の安定したセレクター)を追加します。
コメント
Markdown 対応