如何单独捆绑供应商脚本,并根据需要使用Webpack?

JavaScript Webpack

古一

2020-03-20

我正在尝试做一些我认为应该可行的事情,但是我真的不能仅仅从webpack文档中了解如何做到这一点。

我正在编写一个JavaScript库,其中包含几个可能相互依赖的模块。最重要的是,所有模块都使用jQuery,其中一些可能需要jQuery插件。然后,该库将在可能需要某些或所有模块的几个不同的网站上使用。

定义模块之间的依赖关系非常容易,但是定义它们的第三方依赖关系似乎比我预期的要难。

我想实现的目标是:对于每个应用程序,我都希望有两个捆绑文件,一个具有必要的第三方依赖关系,另一个具有我库中的必要模块。

示例:假设我的库具有以下模块:

  • a(需要:jquery,jquery.plugin1)
  • b(要求:jquery,a)
  • c(要求:jquery,jquery.ui,a,b)
  • d(要求:jquery,jquery.plugin2,a)

我有一个需要模块a,b和c的应用程序(将其视为唯一的条目文件)。在这种情况下,Webpack应生成以下文件:

  • 供应商捆绑包:带有jquery,jquery.plugin1和jquery.ui;
  • 网站捆绑:带有模块a,b和c;

最后,我希望将jQuery作为全局变量,所以我不需要在每个文件上都需要它(例如,我可以只在主文件上需要它)。jQuery插件只会在需要时扩展$全局(如果不需要这些模块的其他模块可以使用它们,这不是问题)。

假设有可能,这种情况下的webpack配置文件示例是什么?我在配置文件上尝试了加载程序,外部程序和插件的几种组合,但是我并没有真正了解它们在做什么以及应该使用哪些。谢谢!

第2519篇《如何单独捆绑供应商脚本,并根据需要使用Webpack?》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

0个回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android