browserify external与exclude之间有什么区别? [英] What is the difference between browserify external vs. exclude?

查看:146
本文介绍了browserify external与exclude之间有什么区别?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用 browserify 并试图使其跳过浪费的时间,包括或解析jquery和其他 require -较少的文件,我已通过CDN加载。

I'm using browserify and trying to get it to skip wasting time including or parsing jquery and other require-less files I've loaded via CDN.

我应该使用 bundle.exclude('jquery')还是 bundle.external('jquery')?有什么区别?它们的输出似乎相同,而文档对我来说还不清楚:

Should I use bundle.exclude('jquery') or bundle.external('jquery')? What is the difference? Their output seemed identical, and the docs are unclear to me:

  • b.external: https://github.com/substack/node-browserify#bexternalfile

防止文件被加载到当前包中,而是
从另一个包中引用。

Prevent file from being loaded into the current bundle, instead referencing from another bundle.

如果文件是数组,则文件中的每个项目都将被外部化。

If file is an array, each item in file will be externalized.

如果文件是另一个捆绑软件,则该捆绑软件的内容将被读取并

If file is another bundle, that bundle's contents will be read and excluded from the current bundle as the bundle in file gets bundled.




  • b.exclude https://github.com/substack/node-browserify# bexcludefile

    • b.exclude: https://github.com/substack/node-browserify#bexcludefile

    • 防止模块名称或文件中的文件出现在输出$中b $ b捆绑包。

      Prevent the module name or file at file from showing up in the output bundle.

      如果您的代码尝试使用require()该文件,则除非您
      提供了另一种加载机制,否则它将抛出该文件。

      If your code tries to require() that file it will throw unless you've provided another mechanism for loading it.


      推荐答案

      答案:



      您应使用 exclude

      这两个函数都阻止文件包含在文件包中。对于您的用例,您可能不会使用 require jQuery,因此使用哪种并不重要。但是,这是怎么回事:

      Both functions prevent the file from being included in the bundle. For your use case, you're probably not going to require jQuery, so it really doesn't matter which you use. However, this is what's going on:

      browserify使用 module-deps 探索您的代码并找到任何 require 语句,然后告诉module-deps在哪里找到所需的模块。

      browserify uses module-deps to explore your code and find any require statements, and then tells module-deps where to find the required module.

      如果文件在捆绑包中,只需在捆绑包的模块映射中提供该文件的密钥。

      If the file is in the bundle, it simply needs to provide the key for it in the bundle's module map.

      如果表示该文件是 external ,browserify假定您是说它是包含在另一个捆绑包中,因此提供了该文件的路径,并假定id将由另一个捆绑包解析。

      If you said the file is external, the browserify assumes you mean it's included in another bundle, and so provides a path to the file assuming that that as an id will resolve from anther bundle. There is a little additional bookkeeping involved to be able to do this.

      如果您排除文件,则可以通过Browserify进行浏览。将为module-deps提供 undefined ,当您尝试使用需要该文件的捆绑软件时,肯定会出问题。但是,这种方法没有跟踪文件路径的开销(这实际上可以忽略不计),并且不会在爆炸之前在其他包中浪费时间。

      If you exclude the file, then browserify will provide undefined to module-deps and there will definitely be a fire when you try to use the bundle that requiring said file. However, this approach lacks the overhead of tracking the file path (which would really be negligible) and doesn't "waste time" looking in other bundles before exploding.

      一些示例:
      我摆弄了node-browserify / example / api来产生一些捆绑包,下面的示例是来自各种测试的模块映射,为便于阅读而对其进行了一定格式设置。

      Some examples: I fiddled with node-browserify/example/api to produce some bundles and the examples below are the module maps from various tests, somewhat formatted for readability.

      香草-在浏览器版本库中按原样运行:

      Vanilla - ran as it is in the browserify repo:

      {
          1: [function(require, module, exports) {
              module.exports = function(n) {
                  return n * 3 };
      
          }, {}],
          2: [function(require, module, exports) {
              var bar = require('./bar');
      
              module.exports = function(n) {
                  return n * bar(n);
              };
      
          }, { "./bar": 1 }],
          3: [function(require, module, exports) {
              var foo = require('./foo');
              console.log(foo(5));
      
          }, { "./foo": 2 }]
      }
      

      3 (main.js)取决于 ./ foo 2

      3 (main.js) depends on ./foo which is at 2

      2 (foo。 js)取决于 ./ bar ,它位于 1

      2 (foo.js) depends on ./bar which is at 1

      1 (bar.js)没有依赖项

      1 (bar.js) has no dependencies

      api / bar.js 标记为外部:

      {
          1: [function(require, module, exports) {
              var bar = require('./bar');
      
              module.exports = function(n) {
                  return n * bar(n);
              };
      
          }, { "./bar": "/browser/bar.js" }],
          2: [function(require, module, exports) {
              var foo = require('./foo');
              console.log(foo(5));
      
          }, { "./foo": 1 }]
      }
      

      2 (main.js)取决于 ./ foo 1

      2 (main.js) depends on ./foo which is at 1

      1 (foo。 js)取决于 ./ bar ,应在其他捆绑包中将其标记为 /browser/bar.js

      1 (foo.js) depends on ./bar which should be labelled /browser/bar.js in some other bundle

      标记为 api / bar.js 以排除:

      {
          1: [function(require, module, exports) {
              var bar = require('./bar');
      
              module.exports = function(n) {
                  return n * bar(n);
              };
      
          }, { "./bar": undefined }],
          2: [function(require, module, exports) {
              var foo = require('./foo');
              console.log(foo(5));
      
          }, { "./foo": 1 }]
      }
      

      2 (main.js)取决于 ./ foo 1

      2 (main.js) depends on ./foo which is at 1

      1 (foo。 js)取决于 ./ bar 在ZOMFG!我不知道它在哪里。 yru require ??!1!

      1 (foo.js) depends on ./bar which is at ZOMFG! I dunno where it is. yru require??!1!

      删除了排除/外部调用,并删除了 ./ bar的要求来自 foo.js

      Removed the exclude/external call, and removed the require of ./bar from foo.js:

      {
          1: [function(require, module, exports) {
              module.exports = function(n) {
                  return n * bar(n);
              };
      
          }, {}],
          2: [function(require, module, exports) {
              var foo = require('./foo');
              console.log(foo(5));
      
          }, { "./foo": 1 }]
      }
      

      2 (main.js)取决于 ./ foo 1

      2 (main.js) depends on ./foo which is at 1

      1 (foo。 js)没有依赖项,世界是桃红色的。我想知道他们是否通过其他方式加载了 bar

      1 (foo.js) has no dependencies, the world is peachy. I wonder if they loaded bar by some other means

      这篇关于browserify external与exclude之间有什么区别?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆