【问题标题】:How to fix Next.js Vercel deployment module not found error如何修复 Next.js Vercel 部署模块未找到错误
【发布时间】:2020-10-04 06:20:37
【问题描述】:

我的 next.js 应用程序可以在我的机器上运行,并且在部署到 Vercel 时可以运行,但现在在 Vercel 上构建时它会失败,并出现以下错误:

我尝试删除 node_modules 并运行 npm install 几次,但没有任何乐趣。

任何帮助将不胜感激。谢谢!

运行“npm run build” 20:43:24.926
tdwcks@1.0.0 构建 /vercel/5ccaedc9 20:43:24.926
下一个构建 20:43:24.967
内部/模块/cjs/loader.js:983 20:43:24.967
抛出错误; 20:43:24.967
^ 20:43:24.967
错误:找不到模块“../build/output/log” 20:43:24.967
需要堆栈: 20:43:24.967
- /vercel/5ccaedc9/node_modules/.bin/next 20:43:24.967
在 Function.Module._resolveFilename (internal/modules/cjs/loader.js:980:15) 20:43:24.967
在 Function.Module._load (internal/modules/cjs/loader.js:862:27) 20:43:24.967
在 Module.require (internal/modules/cjs/loader.js:1042:19) 20:43:24.967
在要求(内部/模块/cjs/helpers.js:77:18) 20:43:24.967
在对象。 (/vercel/5ccaedc9/node_modules/.bin/next:2:46) 20:43:24.967
在 Module._compile (internal/modules/cjs/loader.js:1156:30) 20:43:24.967
在 Object.Module._extensions..js (internal/modules/cjs/loader.js:1176:10) 20:43:24.967
在 Module.load (internal/modules/cjs/loader.js:1000:32) 20:43:24.967
在 Function.Module._load (internal/modules/cjs/loader.js:899:14) 20:43:24.967
在 Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:74:12) { 20:43:24.967
代码:'MODULE_NOT_FOUND', 20:43:24.967
要求堆栈:['/vercel/5ccaedc9/node_modules/.bin/next'] 20:43:24.967
} 20:43:24.969
npm 错误!代码生命周期 20:43:24.969
npm 错误!错误号 1 20:43:24.970
npm 错误! tdwcks@1.0.0 构建:next build 20:43:24.970
npm 错误!退出状态 1 20:43:24.970
npm 错误! 20:43:24.970
npm 错误! tdwcks@1.0.0 构建脚本失败。 20:43:24.970
npm 错误!这可能不是 npm 的问题。上面可能有额外的日志输出。 20:43:24.974
npm 错误!可以在以下位置找到此运行的完整日志: 20:43:24.974
npm 错误! /vercel/.npm/_logs/2020-06-17T19_43_24_971Z-debug.log 20:43:24.979
错误:命令“npm run build”以 1 退出 20:43:25.342
[dmesg] 如下: 20:43:25.342
[962.449223] ecs-bridge: 端口 1(veth2a021300) 进入禁用状态 20:43:25.342
[962.453655]设备veth2a021300进入混杂模式 20:43:25.342
[962.457686] ecs-bridge: 端口 1(veth2a021300) 进入阻塞状态 20:43:25.342
[962.462004] ecs-bridge: 端口 1(veth2a021300) 进入转发状态 20:43:26.242
完成“package.json”

这是我的 Package.json

{
  "name": "tdwcks",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "dev": "next",
    "build": "next build",
    "start": "next start"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "cjs": "0.0.11",
    "core-util-is": "^1.0.2",
    "framer-motion": "^1.11.0",
    "gray-matter": "^4.0.2",
    "next": "^9.4.4",
    "raw-loader": "^4.0.1",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-ga": "^3.0.0",
    "react-markdown": "^4.3.1",
    "react-player": "^2.2.0",
    "react-scripts": "^3.4.1"
  },
  "devDependencies": {
    "postcss-preset-env": "^6.7.0",
    "tailwindcss": "^1.4.6"
  }
}

【问题讨论】:

  • 所以你可以使用npm run build在本地机器上成功构建?
  • 是的,在我的本地机器上构建完全没问题。
  • 你使用 .gitignore 文件吗?如果有,里面有什么?
  • @tenclea 不,我没有。
  • 您是否尝试过使用另一个版本的next 模块?

标签: reactjs npm next.js vercel


【解决方案1】:

如果您不小心将 node_modules 提交到项目的 Git 存储库,通常会发生此错误。

您可以尝试执行以下操作吗?

  1. 确保所有更改都已提交并且您拥有一个干净的目录。
  2. 运行rm -rf node_modules(或删除Windows上的文件夹)。
  3. 运行git add -A,然后运行git commit -m "Remove all module files"
  4. node_modules 添加到您的.gitignore 文件中(并保存)。
  5. 运行git add -A,然后运行git commit -m "Update ignored files"
  6. 通过git status 验证您的目录是否完全干净。
  7. 然后,运行git push。此部署应该可以在 Vercel 上运行。
  8. 最后,根据您的包管理器重新运行 npm iyarn 以使您的本地副本正常工作。

【讨论】:

  • 这就是答案,我发现了很多关于这个问题的问题,在这种情况下对我来说它是有效的,只有第 1 步对我有效,谢谢!
【解决方案2】:

我必须编辑我的package.json 才能使用node_modules/next 目录中附带的next 二进制文件:

"scripts": {
  "start": "node_modules/next/dist/bin/next start -p $PORT"
}

不是最优雅的修复,但它有效。

【讨论】:

  • 这是唯一对我有用的东西。但是为什么 NextJS 期望在我们已经运行导出命令的生产部署中使用 node_modules。这令人难以置信
  • 你在哪里部署你的代码?我在 Microsoft Azure 中成功使用了环境变量:github.com/vercel/next.js/discussions/…
  • 它已部署到 Azure DevOps(私有存储库)并由自定义管道选取。现在工作正常,使用您更新的package.jsonyarn start
【解决方案3】:

我遇到了同样的问题。我认为这可能是 Vercel 部署基础架构的内部问题。注意它失败的那一行:

Error: Cannot find module '../build/output/log' 20:43:24.967
Require stack: 20:43:24.967
- /vercel/5ccaedc9/node_modules/.bin/next 20:43:24.967

我的问题从昨天开始,非常出乎意料——即通过一个非常简单的提交。就我而言,以前成功的部署也失败了。同样,删除项目并重新开始也无济于事。我正在与 Vercel 支持人员沟通,但他们尚未确认问题已解决或提供任何解决方案。

【讨论】:

  • 这很有趣,我也会得到他们的支持。
  • 我收到了他们相当可疑但成功的回复。 node_modules 是您回购的一部分吗?如果是这样,请尝试删除它。不知道为什么这会突然成为一个部署问题,因为我之前已经用这个项目成功部署了数百次。尽管如此,无论他们遇到什么问题,我似乎都可以通过从 repo 本身中删除 node_modules 来解决(还有 .next/,如果你也有的话)
  • 您好,如果您在使用 Vercel 时遇到问题,请发送邮件至 vercel.com/support/request 与我们联系,并附上复印件,以便我们为您提供帮助。
【解决方案4】:

我有同样的问题。在我的 github 桌面中,我注意到在编辑器中大写的文件不在 github 桌面中。修复拼写以匹配 github 上显示的内容,项目构建成功。

【讨论】:

  • 是的,我重命名了一个文件夹,但由于某种原因更新没有推送到 git
【解决方案5】:

这个答案对我有用:https://stackoverflow.com/a/55541435/3051080

TL;DR;更新git cache

git rm -r --cached .
git add --all .
git commit -a -m "Versioning untracked files"
git push origin master

【讨论】:

    【解决方案6】:

    我好像遇到了同样的错误。

    奇怪的是,我整个周末都在 Vercel 上进行构建,没有任何问题,只是在我将 Tailwind CSS 添加到我的项目后才开始失败。

    使用 Tailwind CSS 添加的第一个构建成功,但未加载样式。

    您仍然可以在https://rolfmadsen.now.sh/ 看到结果。

    使用“vercel dev”的本地构建仍然可以完美运行。

    https://github.com/rolfmadsen/search查看存储库

    构建日志中的错误:

    22:28:35.104  
    Running "npm run build"
    22:28:35.287  
    > search@0.1.0 build /vercel/6ddf29b8
    22:28:35.287  
    > next build
    22:28:35.328  
    internal/modules/cjs/loader.js:983
    22:28:35.329  
      throw err;
    22:28:35.329  
      ^
    22:28:35.329  
    Error: Cannot find module '../build/output/log'
    22:28:35.329  
    Require stack:
    22:28:35.329  
    - /vercel/6ddf29b8/node_modules/.bin/next
    22:28:35.329  
        at Function.Module._resolveFilename (internal/modules/cjs/loader.js:980:15)
    22:28:35.329  
        at Function.Module._load (internal/modules/cjs/loader.js:862:27)
    22:28:35.329  
        at Module.require (internal/modules/cjs/loader.js:1042:19)
    22:28:35.329  
        at require (internal/modules/cjs/helpers.js:77:18)
    22:28:35.329  
        at Object.<anonymous> (/vercel/6ddf29b8/node_modules/.bin/next:2:46)
    22:28:35.329  
        at Module._compile (internal/modules/cjs/loader.js:1156:30)
    22:28:35.329  
        at Object.Module._extensions..js (internal/modules/cjs/loader.js:1176:10)
    22:28:35.329  
        at Module.load (internal/modules/cjs/loader.js:1000:32)
    22:28:35.329  
        at Function.Module._load (internal/modules/cjs/loader.js:899:14)
    22:28:35.329  
        at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:74:12) {
    22:28:35.329  
      code: 'MODULE_NOT_FOUND',
    22:28:35.329  
      requireStack: [ '/vercel/6ddf29b8/node_modules/.bin/next' ]
    22:28:35.329  
    }
    22:28:35.331  
    npm ERR! code ELIFECYCLE
    22:28:35.331  
    npm ERR! errno 1
    22:28:35.332  
    npm ERR! search@0.1.0 build: `next build`
    22:28:35.332  
    npm ERR! Exit status 1
    22:28:35.332  
    npm ERR! 
    22:28:35.332  
    npm ERR! Failed at the search@0.1.0 build script.
    22:28:35.332  
    npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
    22:28:35.336  
    npm ERR! A complete log of this run can be found in:
    22:28:35.336  
    npm ERR!     /vercel/.npm/_logs/2020-06-21T20_28_35_332Z-debug.log
    22:28:35.342  
    Error: Command "npm run build" exited with 1
    

    【讨论】:

    • 注意。我一直在 .gitignore 文件中有 .next。
    【解决方案7】:

    在我的情况下,它看起来与 yarn 和下一个依赖关系有关,即在 node_modules/next/dist/bin/next 内部有关于某事的冲突信息。

    永远不明白为什么在使用 next 并将我们的代码构建到生产环境之后,我们仍然必须依赖(相对)繁重的模块 next

    构建的整个概念被认为是独立于构建工具的。

    【讨论】:

    • 这是唯一对我有用的东西。但是为什么 NextJS 期望在我们已经运行导出命令的生产部署中使用 node_modules。这令人难以置信
    【解决方案8】:

    如何创建一个.gitignore 文件,然后将 .next 文件夹添加到其中?

    【讨论】:

    • 感谢您的帮助。我已经尝试安装 typescript 和为 .next 文件夹创建一个 .gitignore 文件,但遗憾的是没有解决这个问题。
    • @TomWicks 有没有办法让您完全刷新您的 Vercel 应用程序,或者删除这个应用程序以创建另一个应用程序,看看它是否有任何改变?
    • 更新了原问题中的错误信息。我将尝试创建另一个 Vercel 应用程序。
    • 仍然遇到同样的问题 :(
    • @TomWicks 这听起来可能很愚蠢,但您还记得做过任何可能影响构建操作的事情吗? (添加新模块等...)
    【解决方案9】:

    我如何解决 Vercel 上缺少模块的错误。

    1. 显式安装软件包,使其出现在您的package.json
    2. 然后将假定的缺失模块导入应用程序并使用它。

    例如(只是一个场景) // 假设lodash 被认为是缺失的模块,

    1 确保它存在于您的 package.json 中

    "dependencies": {
        // some dependencies ...
        "lodash": "^4.17.20",
        // some other dependencies ...
    },
    

    2 导入并在您的应用中使用它(通常,我只是在非生产环境中 console.log 导入。)

    import LODASH from 'lodash'
    
    if (process.env.NODE_ENV !== 'production') console.log(LODASH)
    

    【讨论】:

      【解决方案10】:

      我以小写字母创建文件夹,然后将其重命名为大写字母,更新了所有导入,但是由于某种原因,Github 在我推送更改时没有更新文件夹名称。我需要用不同的名称重命名。它奏效了。

      【讨论】:

        猜你喜欢
        • 2020-11-08
        • 2022-01-13
        • 1970-01-01
        • 2022-01-17
        • 2022-11-11
        • 2020-09-16
        • 2022-10-07
        • 1970-01-01
        • 2021-09-04
        相关资源
        最近更新 更多