Astroでbuildしたファイルを納品したら、「あのー、パスを全部相対パスにしてもらえますか？」と言われました。
さすがにconfigファイル設定しなおせば、それくらいできるだろと思って調べたら、そんな設定ない。
過去に機能改善の提案はあったようだが、今ではissueもクローズになっている。
Vercelなどのホスティングサービスで使われることを前提に設計されているため、手動でサーバーに置き、元々あったほかのファイルと共存するようなこと考慮されていないようだ。
おいおい、全置換して手動で直すのか？CSSの中の画像パスならまだしも、HTMLはいろんな階層あって一発じゃいけないぜ？そう思って現実逃避するように調べていくと…
神ツール現る！！！
astro-relative-links
インストール
npm install astro-relative-links
configファイルの設定
// astro.config.mjs
import { defineConfig } from 'astro/config';
import relativeLinks from 'astro-relative-links';
export default defineConfig({
// ...
integrations: [relativeLinks()],
});
コマンド
npm run build
※npmスクリプトの設定を変えている人はそれに合わせてbuildコマンドを実行
これだけでbuildされたファイルすべてのパスを相対パスに変換してくれます。
第2階層、第3階層もそれぞれに合わせたパスに、CSSの画像読み込みも相対パスにしてくれます。
ただしルート相対パスと共存し一部だけを相対パスに変えたいということはできないので注意。
そのほか、HTMLを同階層のファイル名でページ分けする（example.htmlなど）場合もindex.html以外は、一つ下の階層（/example/index.html扱い）にされてしまうようなので注意が必要そうです。
それでも導入のハードルは低く、別コマンドの必要もないので、Astroでつくりたいけど相対パスで納品が必要なときには、これを使うだけで解決できるのでとても便利です。
参考
Astro でリンクや参照などを相対パスでビルドする
Astroでビルド時に絶対パスではなく相対パスで出力する【HTML/CSSデータ納品】
HTML で納品するときは、Astro を使うといい