ページをAIに食わせる用に変換するツールsitefetchの使い方

ページをAIに食わせる用に変換するCLI「sitefetch」の使い方を解説します。

sitefetchとは？

sitefetchは指定したWebサイトをAI向けにテキスト化してくれるCLIです。

ヘッダーやサイドバーは無視してくれます。

sitefetchの導入方法

sitefetchはnpmパッケージとして提供されています。
よって、npxでインストールせずに実行できます。もちろん普通にnpm installでインストールして使えます。

インストールせずに使う場合

npx sitefetch ここに引数

インストールしてから使う場合

npm i -g sitefetch

sitefetch ここに引数

sitefetchの使い方

複数ページと単一のページに分けて紹介します。

複数ページを指定する場合

-oオプションで出力ファイル名、--concurrencyで同時実行数を指定します。

sitefetch https://example.com -o site.txt --concurrency 10

https://example.com/blog/**のようなパターンの指定もできます。

sitefetch https://example.com -m "/blog/**" -m "/guide/**"

単一ページを指定する場合

単一ページの取得はちょっと特殊で、-mオプションにURLをもう一度書きます。

sitefetch https://example.com/foo/bar -m "https://example.com/foo/bar" -o bar.txt

セレクタで範囲を指定する

次のようにセレクタで範囲を指定して取得できます。

sitefetch https://vite.dev/guide/why -m "https://vite.dev/guide/why" --content-selector ".content"

クリップボードに入れる

クリップボードに入れたい場合は-oオプションをつけず、代わりに--silentオプションを使いましょう。ログの出力をオフにしてくれます。

sitefetch https://example.com -m "https://example.com" --silent | pbcopy

上記はMacでの例です。pbcopyの部分は各OSに合わせて変更してください。

実際の出力例

実際の例をお見せします。

pnpx sitefetch https://example.com -m "https://example.com"

出力はxmlのようです。ページのコンテンツのほか、タイトル・URLも記載されています。

<page>
  <title>Example Domain</title>
  <url>https://example.com</url>
  <content>This domain is for use in illustrative examples in documents. You may use this domain in literature without prior coordination or asking for permission.

[More information...](https://www.iana.org/domains/example)</content>
</page>

ページのコンテンツ（<content>...</content>）はMarkdown形式です。

RAGとの比較

まずはエディタやプラグインの@ragなどWebページ取得機能を使ってみて、不都合なときにsitefetchを使うのがよさそうです。

筆者がぱっと思いつく使用場面はこんな感じ。

あるサイトの記事をまとめて1つのテキストファイルとして保管しておきたい
あるページの特定の要素だけ抽出したい
いろんなAIツールで読み込ませる予定のページをテキスト化し、補足を加えて保管したい

取得はsitefetchに任せて、その結果をAIに整形してもらうのでもいいかもしれません。

ファイルとして保管すると、添付時にパス補完が効いたりUIで追加するときに便利です。一方、ずっと使いまわしていると古い情報になってしまうので注意です。

以上、sitefetchの紹介でした。CLIなので使い勝手がよいです。
最近はLLMs.txtなどがありますが対応しているサイトが少ないため、ちょくちょくsitefetchにお世話になりそうです。