Skip to content
Blog
Go back

AstroPaperをAstro Integrationsに改造するときのメモ

AstroPaperをAstro Integrationsとして改造するときに気になったことのメモです。

  • Integration側のコードでは、そのプロジェクトのtsconfig.jsonが使われるみたい
    • ユーザー側のtsconfig.jsonで@パスのリダイレクト先を変えようとしても、Integration側には反映されなかった
    • astro-paper.config.tsをユーザー側からリダイレクト先変更で差し替えるのは無理そう
      • viteのプラグインならvirtual modulesを作れる
  • import.meta.globにおけるルートディレクトリは、ユーザー側のプロジェクトのルートを指す
    • なので、Integration側は相対パスを使う必要がある
  • Integration側はAstroIntegrationを作る関数をエクスポートする
    • 今回は、astro:config:setupのフックでupdateConfigやinjectRouteを呼び出して、Integration側にあるものを事前にセットするだけ
      • configの内容はAstroPaperのastro.config.tsからコピペした
      • routeの内容はsrc/pagesにあるファイルをオリジナルと同じになるように列挙した
    • そのときのカレントディレクトリはユーザー側のルートになるので、Integration側のルートは実行中スクリプトのパスから計算する必要がある
  • ユーザーからのastro-paper.config.tsを受け渡す方法として、viteプラグインのvirtual modules機能が使える
    • virtual modulesは仮想的なモジュールをメモリ内に動的に生成できる機能
      • 慣例として、仮想モジュールはvirtual:で始めるらしい
      • モジュール名の頭に\0を付けると仮想モジュールになるらしい
    • AstroIntegration生成関数の引数としてコンフィグオブジェクトを受け取って、そのオブジェクトを返すvirtual modulesを作って、各スクリプトがそれをインポートするようにすれば良い
      • Astroのコンフィグのvite.pluginsに以下のようなプラグインを追加すると、src/config.tsでインポートする@/astro-paper.configが置き換えられる
        • デフォルトでは実ファイルの探索が先に行われるが、enforce: "pre"を付けるとプラグインでの評価が先に行われる
        • 非Integration版をそのままビルドできるようにするため、@/astro-paper.configのまま仮想モジュールにする方法を選択した
{
  name: "virtual astro-paper.config",
  enforce: "pre",
  resolveId(id) {
    if (id !== "@/astro-paper.config") return undefined;
    return "\0@/astro-paper.config";
  },
  load(id) {
    if (id !== "\0@/astro-paper.config") return undefined;
    return `export default ${JSON.stringify(userConfig)};`;
  },
}
  • その他、コンテンツへのパスを変更したい場合は、各所にあるBLOG_PATHを書き換えられるようにする必要がある

参考資料#


Share this post:

Previous Post
Heterogeneous Lookup