呼叫'；require（“jquery”）&x27；只有一次

我用的是大口大口的Browserify

我想按一定的顺序调用我的脚本：jQuery、jQuery、Bootstrap、[其他lib]，然后调用我自己的脚本

这显然是行不通的：

main.js

const$=require（“jquery”）；
要求（“引导”）；
//需要其他LIB
需要（“./scripts.js”）；

scripts.js

$（函数（）{
//不起作用的代码
//因为$没有定义
});

---

但如果我这样做：

main.js

require（“jquery”）；
要求（“引导”）；
//需要其他LIB
需要（“./scripts.js”）；

scripts.js

const$=require（“jquery”）；
$（函数（）{
//可以工作的代码
//因为现在定义了$
});

它可以工作，但我想知道它是否能很好地捆绑我的脚本，并且是否需要两次jQuery是一件好事

---

有更好的方法继续吗？

这实际上是Browserify（以及其他模块捆绑包，如Webpack、Rollup和Parcel）的工作方式！每个模块都应该导入它需要运行的所有其他模块

了解原因的最好方法是了解一点JavaScript模块绑定器的工作原理

当Browserify解析

main.js

文件时，它将

require（“…”）

函数调用识别为该模块的依赖项。例如，

main.js

依赖于

jquery

、

bootstrap

和

/scripts.js

。它开始在内存中构建一个图形，以便知道哪些文件链接到哪个文件

./main.js --> jquery
     |
     + -----> bootstrap
     |
     + -----> ./scripts.js

然后它开始解析每个依赖项，并将它们添加到图中

./main.js --> jquery <----- +
     |                      |
     + -----> bootstrap     |
     |                      |
     + -----> ./scripts.js -+

/main.js-->jquery引导|
|                      |
+----->。/scripts.js-+

每次找到一个新的依赖项时，它都会将其添加到图形中，并对其进行解析，以查看依赖项依赖于哪些模块

如果您的一个模块需要一个已经添加到图中的模块（例如，

/scripts.js

取决于

jquery

），那么捆绑程序不需要再次将其添加到图中，它只创建另一个连接

最终，它将收集您所需的所有模块，并在将其写入磁盘之前将每个模块添加到捆绑包中

不管在代码库中需要jquery多少次，它只会被添加到依赖关系图中一次，这意味着需要它两次是可以的，因为它不会改变捆绑包的大小

随着程序越来越大，依赖关系图也会越来越大，最终会出现复杂的模块关系，如下图所示

---

它甚至可以在全局范围内更好地工作：

global.jQuery=global.$=require（“jQuery”）；

请求的模块会被缓存，您永远不会两次真正需要某些东西，第二次调用只会返回已加载的模块Understand，谢谢！）好啊很清楚！非常感谢：）