事象
Nuxt3アプリ(Static-Hosting)で ビルド時(nuxt build)にエラーが発生。
尚、nuxt devでは発生しなかった。
$ pnpm nuxt build [vite]: Rollup failed to resolve import "vue" from "(プロジェクトルート)/node_modules/.pnpm/nuxt@3.4.3_@types+node@18.0.0_typescript@5.3.3/node_modules/nuxt/dist/app/entry.js". build.rollupOptions.external at viteWarn ((プロジェクトルート)/node_modules/.pnpm/vite@4.3.5_@types+node@18.0.0/node_modules/vite/dist/node/chunks/dep-934dbc7c.js:46561:23) at onRollupWarning ((プロジェクトルート)/node_modules/.pnpm/vite@4.3.5_@types+node@18.0.0/node_modules/vite/dist/node/chunks/dep-934dbc7c.js:46585:9) at onwarn ((プロジェクトルート)/node_modules/.pnpm/vite@4.3.5_@types+node@18.0.0/node_modules/vite/dist/node/chunks/dep-934dbc7c.js:46332:13) at Object.onwarn ((プロジェクトルート)/node_modules/.pnpm/rollup@3.21.5/node_modules/rollup/dist/es/shared/node-entry.js:25305:13) at ModuleLoader.handleInvalidResolvedId ((プロジェクトルート)/node_modules/.pnpm/rollup@3.21.5/node_modules/rollup/dist/es/shared/node-entry.js:23940:26) at (プロジェクトルート)/node_modules/.pnpm/rollup@3.21.5/node_modules/rollup/dist/es/shared/node-entry.js:23900:26
構成
- pnpm
- monorepo構成
- v8.10.5
- Nuxt v3.4.3
- vite v4.3.5
解決策1(非常に非推奨)
pnpm install --shamefully-hoistでインストールし直す。
ただし、非常に非推奨*1。
$ pnpm install --shamefully-hoist ✔ The modules directory at "(プロジェクトルート)/node_modules" will be removed and reinstalled from scratch. Proceed? (Y/n) · true
参考
解決策2
.npmrcに以下の設定を追加し、再度pnpm installするとビルドに成功した。
また、node_moduleフォルダはすべてもモジュールから削除した。
正直pnpm install --shamefully-hoistと同じだと思うが、設定がコードに記述されているかどうかの違いだと思われる(確証なし)。
# .npmrc shamefully-hoist=true
失敗した方法
GoogleのAI Bardに聞いてみた。
(一部抜粋) エラーメッセージから、Nuxt のビルド時に vue モジュールが外部化されていないことが原因であると分かります。 vue モジュールは、Nuxt の動作に必須のモジュールです。これを外部化すると、Nuxt の動作に問題が生じてしまう可能性があります。 このエラーを解決するには、vue モジュールを外部化しない方法をとるか、外部化する場合でも、明示的に build.rollupOptions.external に追加する必要があります。
nuxt buildでエラーになったモジュールをnuxt.config.tsのbuild.rollupOptions.externalに設定する。
→ビルドはできるが、vue自体が外部化され参照エラーでアプリ起動に失敗する。
- nuxt.config.ts
export default defineNuxtConfig({
// 追加した設定のみ記載
vite: {
build: {
rollupOptions: {
external: [
'vue',
'vue-router'
]
}
}
}
})
