Build hangs after migrating Nuxt3.2 to Nuxt3.11
lewis999bits opened this issue · comments
Environment
- Operating System: Darwin
- Node Version: v20.12.2
- Nuxt Version: 3.11.2
- CLI Version: 3.11.1
- Nitro Version: 2.9.6
- Package Manager: npm@10.5.0
- Builder: -
- User Config: modules, plugins, vite, runtimeConfig, routeRules
- Runtime Modules: @nuxtjs/tailwindcss@6.12.0, @pinia/nuxt@0.5.1, @nuxt/content@2.12.1, @nuxtjs/supabase@1.2.2, @vueuse/motion/nuxt@2.1.0, @use-wagmi/nuxt@2.2.0
- Build Modules: -
Reproduction
Since the project is large scale and related with configuration thus wasn't able to share the reproduction
Describe the bug
I have Nuxt 3.2 project and needed to migrate it to latest Nuxt and necessary packages. But after migration, project build are hanging thus cannot deploy on vercel or anywhere.
Additional context
Here's the upgraded dependencies:
"devDependencies": {
"@nuxt/content": "^2.12.1",
"@nuxtjs/tailwindcss": "^6.12.0",
"@tailwindcss/aspect-ratio": "^0.4.2",
"nuxt": "^3.11.2"
},
"dependencies": {
"@hotjar/browser": "^1.0.9",
"@nuxtjs/axios": "^5.13.6",
"@nuxtjs/supabase": "^1.2.2",
"@pinia/nuxt": "^0.5.1",
"@rainbow-me/rainbowkit": "^2.0.6",
"@sendgrid/mail": "^8.1.3",
"@supabase/gotrue-js": "^2.62.2",
"@supabase/supabase-js": "^2.43.1",
"@tailwindcss/forms": "^0.5.7",
"@tanstack/query-persist-client-core": "^5.35.1",
"@tanstack/query-sync-storage-persister": "^5.35.1",
"@tanstack/vue-query": "^5.35.1",
"@tryghost/content-api": "^1.11.21",
"@use-wagmi/nuxt": "^2.2.0",
"@vue/shared": "3.4.26",
"@vueuse/components": "^10.9.0",
"@vueuse/motion": "^2.1.0",
"@walletconnect/modal": "^2.6.2",
"axios": "^1.6.8",
"chart.js": "^4.4.2",
"chartjs-adapter-date-fns": "^3.0.0",
"chartjs-plugin-watermark": "^2.0.2",
"chartjs-to-image": "^1.2.2",
"daisyui": "^4.10.5",
"date-fns": "^3.6.0",
"ethers": "^6.12.1",
"h3": "^1.11.1",
"html-to-image": "^1.11.11",
"html2canvas": "^1.4.1",
"jsonwebtoken": "^9.0.2",
"lite-youtube-embed": "^0.3.2",
"moment": "^2.30.1",
"moralis": "^2.26.1",
"pathe": "^1.1.2",
"pinia": "^2.1.7",
"use-wagmi": "^1.5.0",
"viem": "^2.9.32",
"vite-plugin-node-polyfills": "^0.21.0",
"vue": "^3.4.21",
"vue-chartjs": "^5.3.1",
"vue-gtag-next": "^1.14.0",
"vue-hotjar": "^1.4.0",
"vue-hotjar-next": "^2.0.1",
"vue-recaptcha-v3": "^2.0.1",
"vue3-circle-progress": "^1.0.7",
"vue3-lottie": "^3.3.0"
}
And nuxt configuration:
import { nodePolyfills } from "vite-plugin-node-polyfills";
export default defineNuxtConfig({
modules: [
"@nuxtjs/tailwindcss",
"@pinia/nuxt",
"@nuxt/content",
"@nuxtjs/supabase",
"@vueuse/motion/nuxt",
[
"@use-wagmi/nuxt",
{
excludeImports: ["useQuery"],
},
],
],
plugins: [
"~/plugins/vue-hotjar-next.client.js",
"~/plugins/google-recaptcha.ts",
],
vite: {
plugins: [nodePolyfills()],
},
runtimeConfig: {
contentKey: process.env.GHOST_CONTENT_API_KEY,
sendGridKey: process.env.SENDGRID_KEY,
recaptchaKey: process.env.RECAPTCHA_SECRET,
moralisKey: process.env.MORALIS_KEY,
supabaseKey: process.env.SUPABASE_KEY,
supabaseURL: process.env.SUPABASE_URL,
public: {
zapierHook: process.env.ZAPIER_HOOK,
gtagId: process.env.GTAG_ID,
...
motion: {
directives: {
"pop-bottom": {
initial: {
scale: 0,
opacity: 0,
y: 100,
},
visible: {
scale: 1,
opacity: 1,
y: 0,
},
},
},
},
},
},
Logs
> build
> nuxt build
Nuxt 3.11.2 with Nitro 2.9.6 6:33:26 PM
ℹ Using Tailwind CSS from ~/assets/css/tailwind.css nuxt:tailwindcss 6:33:26 PM
ℹ Building client... 6:33:27 PM
ℹ vite v5.2.11 building for production... 6:33:27 PM
transforming (25) node_modules/nuxt/dist/app/components/nuxt-root.vue
🌼 daisyUI 4.10.5
├─ ✔︎ 2 themes added https://daisyui.com/docs/themes
╰─ ❤︎ Support daisyUI project: https://opencollective.com/daisyui
node_modules/use-wagmi/dist/esm/hooks/useAccount.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/use-wagmi/dist/esm/hooks/useAccount.js" was ignored.
node_modules/use-wagmi/dist/esm/hooks/useAccountEffect.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/use-wagmi/dist/esm/hooks/useAccountEffect.js" was ignored.
node_modules/use-wagmi/dist/esm/hooks/useBalance.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/use-wagmi/dist/esm/hooks/useBalance.js" was ignored.
node_modules/use-wagmi/dist/esm/hooks/useBlock.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/use-wagmi/dist/esm/hooks/useBlock.js" was ignored.
node_modules/use-wagmi/dist/esm/hooks/useBlockNumber.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/use-wagmi/dist/esm/hooks/useBlockNumber.js" was ignored.
node_modules/use-wagmi/dist/esm/hooks/useBlockTransactionCount.js (1:0): Module level directives cause errors when bundled, "use client" in "node_modules/use-wagmi/dist/esm/hooks/useBlockTransactionCount.js" was ignored.
...
Σ Total size: 20 MB (5.6 MB gzip)
✔ You can preview this build using node .output/server/index.mjs
Would you be able to provide a reproduction? 🙏
More info
Why do I need to provide a reproduction?
Reproductions make it possible for us to triage and fix issues quickly with a relatively small team. It helps us discover the source of the problem, and also can reveal assumptions you or we might be making.
What will happen?
If you've provided a reproduction, we'll remove the label and try to reproduce the issue. If we can, we'll mark it as a bug and prioritize it based on its severity and how many people we think it might affect.
If needs reproduction
labeled issues don't receive any substantial activity (e.g., new comments featuring a reproduction link), we'll close them. That's not because we don't care! At any point, feel free to comment with a reproduction and we'll reopen it.
How can I create a reproduction?
We have a couple of templates for starting with a minimal reproduction:
👉 https://stackblitz.com/github/nuxt/starter/tree/v3-stackblitz
👉 https://codesandbox.io/s/github/nuxt/starter/v3-codesandbox
A public GitHub repository is also perfect. 👌
Please ensure that the reproduction is as minimal as possible. See more details in our guide.
You might also find these other articles interesting and/or helpful:
Sorry but I'm afraid that I cannot share the project because this is HIGH PRIVATE repository and I shared necessary part of code for resolving errors. What I want to confirm is that the above packages are still recommended to use with Nuxt 3.11 or if there are any configuration that somehow taken wrongly.
@lewis999bits Nobody requires you to upload your whole project as that wouldn't be a minimal reproduction anyway. So please provide a minimal reproduction that is runnable, e.g. via StackBlitz or Git repo 😋