首页 > 解决方案 > 在我的 webpack (nuxt) 项目中导入其他模块使用的模块

问题描述

我意识到导入第三方模块(即.vue 组件)内部使用的模块(例如moment.js)会生成一个模块是冗余的,因为导入了两次。

这是预期的行为还是我错过了什么?

如果重要的话,在 package.json 中的版本是完全一样的。

标签: webpackmodulenuxt.jsnom

解决方案


行为是正确的。一般来说,Webpack 会遍历应用程序的依赖树(包括传递依赖,即依赖的依赖)。

此外,只要导致该依赖项的所有导入都解析到同一个文件,webpack 就会确保它只打包某个依赖项一次。此行为仅在以下情况下发生变化:

  1. 您的代码或 node_modules 中有符号链接(或快捷链接)。
  2. 您有相同依赖项的多个版本。
  3. 意外的大写/小写字母更改会导致不同的文件(有时,在 Linux 上构建不区分大小写的 Windows 上编写的代码时会发生这种情况,反之亦然。)
  4. 在极少数情况下,如果您使用动态导入,Webpack 有时无法确定确切的依赖关系。

您可以使用 Webpack 分析器来找出捆绑包中的此类异常。此外,您还可以使用 Webpack解析功能来指导 Webpack 永远不要两次打包类似的依赖项(仅按补丁号左右延迟)。


推荐阅读