如何解决无法导入模块'@nuxt/builder'？答案

【问题标题】：How to resolve Cannot import module '@nuxt/builder'?如何解决无法导入模块'@nuxt/builder'？
【发布时间】：2021-07-12 00:54:15
【问题描述】：

所以我最近在家里使用 .NET Core 和 Nuxt.js 前端创建了一个新项目。

我知道该网站在它只是一个 Vue 应用程序时运行。我知道该网站是在关注this post 之后作为基础 Nuxt.js 应用程序运行的。

然后我想添加一些我们在工作中继承的 Nuxt 项目中使用的功能，但是当我尝试构建它时遇到了这个错误。

 FATAL  Cannot import module '@nuxt/builder'                                                                                                  16:16:47  

  at Function.Module._resolveFilename (internal/modules/cjs/loader.js:1020:15)
  at Function.Module._load (internal/modules/cjs/loader.js:890:27)
  at Module.require (internal/modules/cjs/loader.js:1080:19)
  at n (node_modules\jiti\dist\v8cache.js:2:2472)
  at Object.<anonymous> (node_modules\webpack-dev-middleware\dist\utils\setupHooks.js:8:39)
  at Module.o._compile (node_modules\jiti\dist\v8cache.js:2:2778)
  at Object.Module._extensions..js (internal/modules/cjs/loader.js:1196:10)
  at Module.load (internal/modules/cjs/loader.js:1040:32)
  at Function.Module._load (internal/modules/cjs/loader.js:929:14)
  at Module.require (internal/modules/cjs/loader.js:1080:19)

我可以看到 @nuxt/builder 在我的 package-lock.json 文件中被引用，但它没有在 package.json 文件中被引用。

我尝试在我的家庭项目中安装“缺失”包，但错误仍然存在。

感觉就像 - 从我所读到的 - 这个包以某种方式内置到 Nuxt 中，但 Nuxt 已经失去了它的弹珠并且找不到它。

我可以做些什么来解决这个问题，因为我无法通过搜索找到涵盖此特定故障的示例，所以我被阻止并且不知道如何继续前进。我不想从头再来，而且我很想了解根本原因。

非常感谢任何帮助。

【问题讨论】：

有趣...作为一种预感，我在 nuxt.config.js 的 buildModules 部分中添加了对 @nuxt/builder 的引用，并且看，问题已解决。当然，现在还有两个问题，但这就是开发生活。现在它抱怨 Webpack 丢失了，但我们没有在工作时在 package.json 中引用这些包中的任何一个——这表明我们已经在其他地方配置了这些包，用于在直接项目文件之外定义的构建过程.嗯。
Nuxt 在底层依赖于 Webpack（就像 Vue CLI 的构建过程一样）。 webpack 在这里是一个传递依赖，它不会在你的package.json 中列出。
谢谢@tony19，这就是我的怀疑。原来这是一条“红鲱鱼”。我剥离了我的 Nuxt 配置并一一启用了功能并解决了其他问题，直到我现在有了一个工作项目。我认为这是一次扔太多东西并希望它们能很好地融合在一起的情况。现在应该知道这些事情了：P

标签： vue.js .net-core nuxt.js

【解决方案1】：

就我而言，我删除了 package-lock.json 和 node_modules，然后重新运行

npm 安装

npm 运行构建

【讨论】：

【解决方案2】：

对于和我一样的人来说，批判性地思考。

如果感觉有些不对劲，那可能就是。尽可能还原您的更改，直到您的项目再次运行，然后确保在每次添加/更改时对其进行测试。

在我的情况下，我关闭了一堆设置并删除了最终不需要的包（即 webpack 和 @nuxt/builder，因为我怀疑它们是 Nuxt 的一部分）然后按照上述步骤操作，直到开始工作再次。

【讨论】：

【解决方案3】：

我被这个错误困住了一个小时。堆栈跟踪是：

 ERROR  Cannot import module '@nuxt/builder'                                                                                  15:17:39

  at Function.Module._resolveFilename (internal/modules/cjs/loader.js:815:15)
  at Function.Module._load (internal/modules/cjs/loader.js:667:27)
  at Module.require (internal/modules/cjs/loader.js:887:19)
  at n (node_modules/jiti/dist/v8cache.js:2:2472)
  at Object.<anonymous> (node_modules/@nuxt/friendly-errors-webpack-plugin/src/core/extractWebpackError.js:4:26)
  at Module.o._compile (node_modules/jiti/dist/v8cache.js:2:2778)
  at Object.Module._extensions..js (internal/modules/cjs/loader.js:1027:10)
  at Module.load (internal/modules/cjs/loader.js:863:32)
  at Function.Module._load (internal/modules/cjs/loader.js:708:14)
  at Module.require (internal/modules/cjs/loader.js:887:19)

我查看了node_modules/@nuxt/friendly-errors-webpack-plugin/src/core/extractWebpackError.js，在 L4 上我看到了这个：

const RequestShortener = require('webpack/lib/RequestShortener')

预感我跑了npm ls webpack 并看到了一个未满足的对等依赖关系。然后我运行npm install --save-dev webpack 并修复了错误。

【讨论】：