javascript-如何使用Browserify避免代码重复

CommonJS菜鸟,在这里,我读到有关browserify的内容,并认为它比我现有的RequireJS设置要简单,所以我继续进行更改.我发现我将在每个捆绑软件中都有代码重复.让我解释：

可以说,我让page1.js和page2.js都使用jquery.js和jquery-ui.js

现在,我必须创建bundle1.js和bundle2.js,并且每个捆绑包中jquery.js和jquery-ui.js的内容都是重复的.

我尝试通过仅捆绑jquery.js和jquery-ui.js将浏览器分为不同的文件,例如：

<script src="lib_bundle.js">
<script src="page1.js">

问题是page1.js中的require将失败,因为它不是commonjs捆绑包.

解决方法:

这就是external requires的用途.我不熟悉browserify的命令行,但是在使用JavaScript API时,您可以执行以下操作.这会将常见的依赖项捆绑在一起.然后,其他捆绑包可以将它们称为“外部”.

var browserify = require('browserify');

var externalDependencies = [
  'jquery',
  'jquery-ui'
];

// shared libraries bundle (i.e. jquery, jquery-ui)
var libsBundle = browserify({
  // your options
  // ...
  require: externalDependencies
});

// main bundle (i.e. page1, page2)
var mainBundle = browserify({
  // your options
  // ...
});
mainBundle.external(externalDependencies);

libsBundle.bundle();
mainBundle.bundle();

脚本标签：

<script src="libsBundle.js">
<script src="mainBundle.js">

标签：browserify,commonjs,javascript
来源： https://codeday.me/bug/20191120/2042957.html