Nuxtにおけるルーティング設定とCatch-all Route

Nuxtのpagesやserverではfile-system routingを採用しており、URLの構造のソースコードディレクトリ構造を一致させることができる。

nuxt.com

nuxt.com

serverのディレクトリなどにおいて、リクエストパスがいずれのルーティング設定とも一致しない場合のデフォルト値(フォールバック)として、Catch-all Routeを定義できる。 例えば example.com/api/foo/bar/baz のようなリクエストパスに対して、~/server/api/foo/[...].tsというファイルを配置しておくと、~/server/api/foo/bar/baz.ts ファイルが存在しなくても [...].ts が評価されるようになる。

nuxt.com

初めて Catch-all Routeの仕組みを知ったのだが、最初に[...].ts という記述をドキュメントで見たときは適当な文字列で置き換えてね、という意味だと勘違いして混乱した。 実際はCatch-all Routeという仕組みであり本当にブラケットを含むファイルを作成する必要がある。

また、この記法はNext.jsなどでも同じように使われているらしい。

nextjs.org