Next.js 报错：Error: Cannot find module '@babel/core'

在使用 Next.js 进行前端开发时，我们可能会遇到这样的情况：当我们运行 npm run dev 命令来启动开发服务器时，终端输出以下报错信息：

Error: Cannot find module '@babel/core'

这个问题基本上是由于 babel 依赖被 Next.js 所打包，而并不在项目中的 node_modules 目录中，导致无法找到它而产生的。

解决方法

解决这个问题非常简单，只需要在项目根目录下执行以下命令即可：

npm install --save-dev @babel/core

或者

yarn add --dev @babel/core

这样我们就安装了 @babel/core 这个包，它是 babel 的核心依赖，这样就能解决这个问题了。

示例代码

下面是一个基于 Next.js 的示例代码：

-- -------------------- ---- -------
------ - -------- - ---- --------

----- ------- - -- -- -
  ----- ------- --------- - ------------

  ------ -
    -----
      ----------------
      --------- -----------
      ------- ----------- -- -------------- - ----------------------
    ------
  --
--

------ ------- --------

这里使用了 React 中的 useState hook，来记录当前的计数器数值，并且可以通过按钮进行增加。

总结

如果在使用 Next.js 过程中遇到类似于 Error: Cannot find module '@babel/core' 的错误信息，只需要安装 @babel/core 这个包即可。此外，还可以考虑升级 Next.js 的版本，如果你的版本过低，可能也会出现这个报错。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/648d5f1f48841e9894bab98e