[vercel/next.js]12.0.8 中的笑话回归:TypeError: require.resolveWeak 不是函数

2024-05-10 165 views
8
运行next info(从版本 12.0.8 及更高版本可用)
Operating System:
  Platform: win32
  Arch: x64
  Version: Windows 10 Enterprise
Binaries:
  Node: 16.8.0
  npm: 7.21.0
  Yarn: 1.22.10
  pnpm: N/A
Relevant packages:
  next: 12.0.8
  react: 17.0.2
  react-dom: 17.0.2
您使用的 Next.js 版本是什么?

12.0.8

您使用的 Node.js 版本是什么?

16.8.0

您使用什么操作系统?

Windows 11 Enterprise(顺便问一下,为什么下一个信息说我正在使用 Windows 10?)

您如何部署您的应用程序?

在 Azure 应用服务上作为 docker 容器

描述错误

我们有一个 Next.js 网站,其中的单元测试使用 Jest。当我尝试将网站从 Next.js 12.0.7 升级到 12.0.8 时,使用动态代码加载的测试代码的单元测试开始失败。

在我看来,这与之前关闭的错误有关,这将使其成为 Next.js 12.0.8 的回归:TypeError: require.resolveWeak 不是函数(玩笑测试)#19862

输出示例

  ● Test suite failed to run

    TypeError: require.resolveWeak is not a function

    > 29 | const HeaderSearchBoxMobile = dynamic(() => import('../HeaderSearchBox/HeaderSearchBoxMobile/HeaderSearchBoxMobile'));
预期行为

即使测试的代码使用dynamic(),测试也应该通过

重现

运行 Jest 测试,其中测试代码测试一些使用dynamic() 加载其他代码的代码。

回答

1

根据您的重现,我无法重现此问题。你能创建一个我可以看一下吗?

On :操作系统版本由本机Node.js APInext info报告,因此我们对此无能为力。可能与您使用的 Node.js 版本有关,也许您必须更新 Node.js。os.version()

7

我们在代码库中看到了同样的问题(封闭源代码,抱歉):next@12.0.8运行时测试失败jest;一切next@12.0.7都很好。奇怪的是,jest --coverage两个版本都运行得很好。

6

嗨,@Parnswir,谢谢!请创建一个小型公共复制品,然后:祈祷:我看不到该问题,因此它可能与您的项目具体相关。尝试减少页面/组件/代码的数量,直到可以共享并且问题仍然重现为止。

这是关于这个主题的一个很好的资源。

3

https://codesandbox.io/s/next-dynamic-22ejz

如果你在codesandbox上fork它,你可以npm test在右侧的终端中运行(单击+图标)。在next@12.0.8(安装在此沙箱中)上,测试将失败。如果降级到next@12.0.7(在左侧依赖项列表中选择版本),测试就会通过。

通常,当codesandbox容器挂起时;您可以从左侧菜单重新启动下一个服务器: 图像

2

唔。感谢 CodeSandbox,它很有帮助!我认识到您没有遵循https://nextjs.org/docs/testing中的测试设置

应用这些似乎可以解决问题。你能尝试一下吗?

@zmarty 您是否在测试环境中使用自定义/Babel 设置?你能分享一下吗?

3

唔。感谢 CodeSandbox,它很有帮助!我认识到您没有遵循https://nextjs.org/docs/testing中的测试设置

应用这些似乎可以解决问题。你能尝试一下吗?

@zmarty 您是否在测试环境中使用自定义/Babel 设置?你能分享一下吗?

您到底指的是什么,或者您在codesandbox中到底更改了什么以使测试运行?你能提供一个链接吗?

4

@zmarty 您是否在测试环境中使用自定义/Babel 设置?你能分享一下吗?

到目前为止,我们已经尝试在空的 Next.js 实例上重现这一点,但我们做不到。

我们在几个版本前就完全停止使用网站的自定义 babel 设置了。

我确实看到我们在 next.config.js 中使用了一些自定义的 webpack 配置,所以我们也会关注它。在单元测试文件夹中,我只看到我们设置了一些模拟。

6

我们还尝试了https://github.com/vercel/next.js/tree/canary/examples/with-jest示例,它可以正常工作。

不幸的是我们仍然需要 babel,否则我们无法使用 jest 的 automock 功能。我在这里分叉并提供了一个示例: https://github.com/vercel/next.js/compare/canary...duc-gp :example-jest-automock-not-working?expand=1

  • 运行npm run test example.test.js开始测试
  • 当您取消注释中的转换jest.config.js并删除 .babelrc 以便不使用 babel 时,测试不再起作用
4

@duc-gp 请注意,我们还提供了 babel 设置:

@balazsorban44谢谢,我刚刚检查了您提到的设置并添加了一个简单的测试: https://github.com/vercel/next.js/compare/canary...duc-gp :example-jest-automock-not-使用-nextjs-babel-setup?expand=1

当你运行时npm run test DummyA.test.js你可以看到错误TypeError: require.resolveWeak is not a function

3

有趣的是,我仍然无法重现:

图像

您能否添加一个实际的存储库链接以便我可以验证这一点?

1

有趣的是,我仍然无法重现:

图像

您能否添加一个实际的存储库链接以便我可以验证这一点?

你到底做了什么来尝试重现这个?您的屏幕截图来自什么设置?存储库的链接是:https://github.com/duc-gp/next.js/tree/example-jest-automock-not-working-with-nextjs-babel-setup

  • 切换到分支example-jest-automock-not-working-with-nextjs-babel-setup
  • 进入examples/with-jest-babel
  • npm i
  • npm run test DummyA.test.js

编辑:我刚刚在另一台机器上尝试了相同的步骤,也可以重现这一点 图像

我尝试过的节点版本:

  • v14.16.0
  • v16.13.0
1

我再次尝试了一个完全干净的项目yarn create next-app -e with-babel-jest,添加了您的修改,最后复制了它。 :+1:

9

感谢您报告此事。我正在将一个项目升级到 Next.js 12,而 CI 却因为错误而崩溃TypeError: require.resolveWeak is not a function

另一方面,升级指南没有指定升级到 Next 12 时使用 Rust 编译器设置 Jest需要进行的更改。如果能更新文档就好了。

3

发现问题,用涵盖此案例的新测试打开 PR。

7

这是在金丝雀上发布的?请尝试一下:npm install next@canary.

9

这是在金丝雀上发布的?请尝试一下:npm install next@canary.

对我有用?谢谢!

6

伟大的 ?这在 12.1 中已稳定

6

该已关闭的问题已自动锁定,因为它已经一个月没有新活动了。如果您遇到类似问题,请创建一个新问题并包含重现步骤。谢谢。