OSS探訪概要
pathpidaは、Next.jsやVinextのpages構成から内部リンク用の型定義を生成する開発ツールです。生成された`pagesPath`を使い、動的routeやqueryをTypeScriptの型で確認しながらURLを組み立てられます。
特徴と向いている用途
公式資料に基づく紹介・実機未検証 · 内容確認日：
pages構成から`$path.ts`を自動生成する
routeファイルを読み取り、静的path・動的parameterを表現するpagesPathを生成します。watch modeを使えば開発中の変更にも追従できます。
出典：[2]
queryとpublic配下の静的ファイルも型で扱う
page側でQuery/OptionalQueryを定義してURL生成時の引数を型検査でき、--enableStaticではpublic配下の静的ファイルpathも生成できます。
出典：[2]
Next.jsで内部リンクの文字列ミスを減らしたい場合に
動的routeやqueryが増え、router.pushやLinkへ手書きpathを渡す箇所を型安全にしたいプロジェクトに向きます。
出典：[2]
生成元のrouting構成と導入versionを確認する
READMEはpages/を基準にした例を掲載しています。異なるrouting方式や新しいNext.js構成で使う場合は、採用versionの対応範囲を確認してください。
参考にした公式資料
- [1]aspida/pathpida repository(2026-09-21)
- [2]pathpida README(2026-09-21)
- [3]pathpida package.json(2026-09-21)
- [4]pathpida MIT license(2026-09-21)
編集部からの補足
pathpidaは実行時ライブラリではなく、route構成から`$path.ts`を生成するzero-runtimeの開発ツールです。現行mainの`package.json`はversion `0.0.0`を開発用placeholderとしているため、これを公開versionとして扱っていません。READMEの例は`pages/`構成を基準にしているため、異なるrouting構成では互換性を確認してください。
3ステップで試す
- 1
pathpidaを開発依存へ追加
READMEのnpm手順でpath generatorとscript並列実行用packageを追加します。
npm install pathpida npm-run-all --save-dev - 2
生成scriptをpackage.jsonへ追加
READMEのSetup例に従い、pages変更時に$path.tsを再生成するwatch scriptを追加します。
"dev:path": "pathpida --ignorePath .gitignore --watch" - 3
型付きpathを生成して利用
生成されたpagesPathから$url()を呼び、動的routeやqueryがTypeScriptで検査されることを確認します。
npm run dev:path → import { pagesPath } from "../lib/$path"
成長
成長の推移 · 直近30日
518 Stars
推移データを蓄積中です。
開発アクティビティ
直近90日・週次
- Commit（直近30日）
- 4
- Open PR
- 5
開発アクティビティを蓄積中です。
Built with
カテゴリとタグ
カテゴリ
GitHubデータ
関連情報
関連記事を投稿するこのOSSの使い方や活用事例をMarkdownで投稿できます。管理者が承認した後に公開されます。
あわせて探訪
- tRPC40,630 Stars
共通タグ 2件 · 共通カテゴリ 1件 · 同じ言語
TypeScriptの型定義をサーバーからクライアントへ共有し、スキーマ生成なしで入力・出力・エラーまで型安全に扱うRPCフレームワーク。
TypeScript - Onlook26,774 Stars
共通タグ 2件 · 共通カテゴリ 1件 · 同じ言語
Next.js + Tailwindの実コードをFigma風UIとAIから直接編集し、デザインとコードを同じ画面で往復できるビジュアルエディタ。
TypeScript - Plasmic7,030 Stars
共通タグ 2件 · 共通カテゴリ 1件 · 同じ言語
既存Reactコンポーネントをドラッグ&ドロップで使いながら、Webサイト・アプリ・CMSコンテンツを視覚的に構築するビジュアルビルダー。
TypeScript - Frontman702 Stars
共通タグ 2件 · 共通カテゴリ 1件
browser上のDOM・CSS・source mapをcontextに、選択したUIを作るfrontend sourceをAIが直接修正するcoding agent。
ReScript - Cal.diy48,583 Stars
共通タグ 2件 · 同じ言語
Cal.comのEnterprise codeを除き、MITでself-hostできるcommunity scheduling platform。
TypeScript
情報の誤りを報告
掲載内容に誤りや古い情報があればお知らせください。