Nuxt应用部署Vercel失败：找不到global/window模块求助

部署脚本执行正常，但运行时日志抛出如下500错误：

[nuxt] [request error] [unhandled] [500] Cannot find module 
'/var/task/node_modules/global/window' imported from /var/task/chunks/build/server.mjs
 Did you mean to import "global/window.js"?
 at finalizeResolution (node:internal/modules/esm/resolve:269:11)  
 at moduleResolve (node:internal/modules/esm/resolve:937:10)  
 at moduleResolveWithNodePath (node:internal/modules/esm/resolve:1161:14)  
 at defaultResolve (node:internal/modules/esm/resolve:1204:79)  
 at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:383:12)  
 at ModuleLoader.resolve (node:internal/modules/esm/loader:352:25)  
 at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:227:38)  
 at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:87:39)  
 at link (node:internal/modules/esm/module_job:86:36)

本地运行正常，项目package.json配置如下：

{
 "name": "nuxt-app",
 "private": true,
 "type": "module",
 "scripts": {
 "build": "nuxt build",
 "dev": "nuxt dev",
 "generate": "nuxt generate",
 "preview": "nuxt preview",
 "postinstall": "nuxt prepare"
},
 "dependencies": {
    "@aws-sdk/client-s3": "^3.569.0",
    "@aws-sdk/s3-request-presigner": "^3.569.0",
    "@mdi/font": "^7.4.47",
    "@pinia/nuxt": "^0.5.1",
    "@popperjs/core": "^2.11.8",
    "@tanstack/vue-query": "^5.32.1",
    "@videojs-player/vue": "^1.0.0",
    "bcrypt": "^5.1.1",
    "date-fns": "^3.6.0",
    "next-auth": "4.21.1",
    "nuxt": "3.12.3",
    "nuxt-mongoose": "^1.0.5",
    "pinia": "^2.1.7",
    "uuid": "^9.0.1",
    "v-calendar": "next",
    "video.js": "^8.12.0",
    "vue": "3.4.31",
    "vue-router": "^4.3.0"
},
 "devDependencies": {
    "@nuxtjs/google-fonts": "^3.2.0",
    "@sidebase/nuxt-auth": "^0.7.2",
    "@types/bcrypt": "^5.0.2",
    "@types/uuid": "^9.0.8",
    "autoprefixer": "^10.4.19",
    "chalk": "^5.3.0",
    "postcss": "^8.4.38",
    "tailwindcss": "^3.4.1",
    "vite-plugin-vuetify": "^2.0.2",
    "vuetify": "^3.5.7"
  }
}

排查方向与解决方案 #

• 定位引入来源：在项目根目录执行grep -r "global/window" --include="*.js" --include="*.mjs" --include="*.vue" .，找出具体是哪个文件或依赖引入了该路径。
• 修复导入路径：
  • 若为自定义代码导入，将import ... from 'global/window'修改为import ... from 'global/window.js'；
  • 若为第三方依赖问题，尝试升级对应依赖版本，或在nuxt.config.ts中添加别名映射：

    export default defineNuxtConfig({
      alias: {
        'global/window': 'global/window.js'
      }
    })
    

• 统一Node版本：确认Vercel构建环境的Node版本与本地一致，可在Vercel项目设置的「Build & Development Settings」中指定Node版本（如18.x或20.x）。
• 隔离客户端依赖：global/window属于浏览器环境对象，若依赖在服务端渲染时错误引入它：
  • 在nuxt.config.ts中标记依赖为仅客户端处理：

    export default defineNuxtConfig({
      build: {
        transpile: ['目标依赖名']
      },
      vite: {
        ssr: {
          noExternal: ['目标依赖名']
        }
      }
    })
    

  • 或在组件中用<client-only>包裹使用该依赖的内容：

    <client-only>
      <!-- 依赖相关组件代码 -->
    </client-only>
    

• 清理缓存重建：在Vercel触发重新构建时勾选「Clear build cache」，本地执行rm -rf node_modules .nuxt dist package-lock.json后重新安装依赖再推送代码。

内容的提问来源于stack exchange，提问作者clew-bot