Astroで動的なパスの画像を扱う

DRANK

こういう状況がたまにあるはず。.astroでリスト表示をするそして各アイテムにサムネイルを出すそんな時にどうするか。MDXの場合その各アイテムがContent collectionsになってて、ソースがMDXの場合。この場合は、MDXからサムネをexportすればよくて、特に困らない。Images Docs blogCollection = defineCollection({ schema: ({ image }) => z.object({ title: z.string(), cover: image(), // 👀 coverAlt: z.string(), }), });そうじゃない場合は？ドキュメントを読んでてそう思ってしまった。Content collectionsでも、カスタムloaderを使ってるとか、CSVやJSONから生成してるとかの場合に、どうすれば・・・？まず最初に思いつくのは、/publicに置くやり方。 でもこれは避けたい。パスの扱いも困るし、なによりカオスになるのが目に見えてるから。となると、なんとかしてAstro or Viteに画像を認識させて、そのパスを管理させる必要がある。ということに悩んでたら、いちおうドキュメントにレシピとして書いてあった。Dynamically import images Docs async function getItemThumbnailSrcById(id: string) { const path = `/path/…