Astro v5.4.2 から v5.7.10 にしたら Error when evaluating SSR module astro.config.mjs: Cannot use import statement outside a module が出てビルドできなくなった。

2025-05-03
- JavaScript
- Memo

Tailwind CSS v4対応のついでに Astro のバージョンも v5.4.2 から v5.7.10 にしたのですが、 astro check を実行したところ Error when evaluating SSR module astro.config.mjs: Cannot use import statement outside a module が出てビルドできなくなってしまいました。 viteのissueにもastroのissueにも同じ事象の報告がなかったので解決できず詰みかけたのですが、どうにかしました。

エラー内容

> astro check

(node:87440) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
(Use `node --trace-warnings ...` to show where the warning was created)
8:58:21 PM [vite] (ssr) Error when evaluating SSR module /home/sakuramochi/astro-blog/astro.config.mjs: Cannot use import statement outside a module
      at internalCompileFunction (node:internal/vm:77:18)
      at wrapSafe (node:internal/modules/cjs/loader:1288:20)
      at Module._compile (node:internal/modules/cjs/loader:1340:27)
      at Module._extensions..js (node:internal/modules/cjs/loader:1435:10)
      at Module.load (node:internal/modules/cjs/loader:1207:32)
      at Module._load (node:internal/modules/cjs/loader:1023:12)
      at cjsLoader (node:internal/modules/esm/translators:356:17)
      at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:305:7)
      at ModuleJob.run (node:internal/modules/esm/module_job:218:25)
      at async ModuleLoader.import (node:internal/modules/esm/loader:329:24)
[astro] Unable to load your Astro config

Cannot use import statement outside a module
  Stack trace:
    at internalCompileFunction (node:internal/vm:77:18)
    at Module._compile (node:internal/modules/cjs/loader:1340:27)
    at Module.load (node:internal/modules/cjs/loader:1207:32)
    at cjsLoader (node:internal/modules/esm/translators:356:17)
    at ModuleJob.run (node:internal/modules/esm/module_job:218:25)
 ELIFECYCLE  Command failed with exit code 1.

Astroを実行している環境

  System:
    OS: Linux 5.15 Ubuntu 22.04.4 LTS 22.04.4 LTS (Jammy Jellyfish)
    CPU: (12) x64 12th Gen Intel(R) Core(TM) i5-12400F
    Memory: 12.98 GB / 15.54 GB
    Container: Yes
    Shell: 3.3.1 - /usr/bin/fish
  Binaries:
    Node: 21.4.0 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/bin/yarn
    npm: 10.2.4 - /usr/local/bin/npm
    pnpm: 10.9.0 - ~/.local/share/pnpm/pnpm

妙だなと感じた方がいると思うのですが、その予想は多分正しいです。ちなみに私はこの段階でもまだわかりませんでした。
余談ですがastro infoはastro.config.mjsが読めないと出せないのを初めて知りました。

調査

mjsがおかしい可能性は限りなく低いため、verboseを出してみます。

> astro-rambler@1.0.0 astro /home/sakuramochi/astro-blog
> astro check --verbose

  astro:cli --verbose flag enabled! Enabling: DEBUG="astro:*,vite:*" +0ms
  astro:cli Tip: Set the DEBUG env variable directly for more control. Example: "DEBUG=astro:*,vite:* astro build". +0ms
  astro:telemetry [notify] last notified on 1694322186895 +0ms
  astro:Failed to load config with Node TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".tsx" for /home/sakuramochi/astro-blog/src/integrations/og-image.tsx
  astro:Failed to load config with Node     at Object.getFileProtocolModuleFormat [as file:] (node:internal/modules/esm/get_format:160:9)
  astro:Failed to load config with Node     at defaultGetFormat (node:internal/modules/esm/get_format:203:36)
  astro:Failed to load config with Node     at defaultLoad (node:internal/modules/esm/load:143:22)
  astro:Failed to load config with Node     at async ModuleLoader.load (node:internal/modules/esm/loader:409:7)
  astro:Failed to load config with Node     at async ModuleLoader.moduleProvider (node:internal/modules/esm/loader:291:45) +0ms

Integrationをtsxで作っているのですが、それがUnknown file extension扱いになっているようです。なんでですかね。試しにmjsを更地にしてIntegration以外のtsxをビルドしたところ通ったので、なんかNodeの問題な気がします。

解決した方法

Nodeの問題な気がしたのでNodeのバージョンを 23.11.0 に上げました。

$sudo n latest
     copying : node/23.11.0
   installed : v23.11.0 (with npm 10.9.2)

astro checkしてみます。

> astro-rambler@1.0.0 astro /home/sakuramochi/astro-blog
> astro check

(node:56233) ExperimentalWarning: Type Stripping is an experimental feature and might change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
19:44:41 [content] Syncing content
19:44:41 [content] Synced content
19:44:41 [types] Generated 307ms
19:44:41 [check] Getting diagnostics for Astro files in /home/sakuramochi/astro-blog...
Result (44 files): 
- 0 errors
- 0 warnings
- 0 hints

通りました。よかったですね。ちなみに最初の動作環境の段階でお気づきかと思いますが、Node v21はとっくにEOLを迎えていました。私は今日まで知りませんでした。愚かですね。

Astroのビルドが通るようになったのでTailwind v4対応をしようとしたのですが、移行が地獄みたいに面倒で心がばきぼきに折れました。バージョン上げる時は一緒に上げたいので（全部のパッケージのバージョンをまとめて上げるのはおすすめしません。真似しないでください）、しばらくは Astro も v5.4.2 で運用します。

この話とは全然関係ないのですが、というかこれが本題なのですが、劇場版『名探偵コナン隻眼の残像』がとても良かったです。関連エピソードの予習全くせずに行ったけど見てたら大体わかるので別に予習しなくてもいいです。