Qual è la differenza tra browserify esterno vs exclude?

Sto usando browserify e sto cercando di browserify di perdere tempo a includere o analizzare jquery e altri file non necessari che ho caricato tramite CDN.

Dovrei usare bundle.exclude('jquery') o bundle.external('jquery') ? Qual è la differenza? La loro produzione sembrava identica, e la documentazione non mi è chiara:

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

Impedisci il caricamento del file nel pacchetto corrente, facendo invece riferimento a un altro pacchetto.

Se il file è un array, ogni elemento nel file verrà esternalizzato.

Se il file è un altro pacchetto, il contenuto del pacchetto verrà letto ed escluso dal pacchetto corrente man mano che il bundle nel file viene raggruppato.

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

Impedire che il nome del modulo o il file al file vengano visualizzati nel pacchetto di output.

Se il codice prova a richiedere () quel file verrà generato a meno che tu non abbia fornito un altro meccanismo per caricarlo.

Risposta:

Dovresti usare l’ exclude .

Spiegazione:

Entrambe le funzioni impediscono l’inclusione del file nel pacchetto. Per il tuo caso d’uso, probabilmente non avrai require jQuery, quindi non importa quale usi. Tuttavia, questo è quello che sta succedendo:

browserify utilizza i moduli-deps per esplorare il codice e trovare eventuali istruzioni require , quindi indica ai moduli-deps dove trovare il modulo richiesto.

Se il file è nel pacchetto, è sufficiente fornire la chiave per esso nella mappa modulo del pacchetto.

Se hai detto che il file è external , il browserify presuppone che sia incluso in un altro pacchetto e quindi fornisce un percorso al file assumendo che quello come un ID si risolva da un altro pacchetto. C’è un po ‘di contabilità aggiuntiva per essere in grado di farlo.

Se si exclude il file, browserify fornirà un valore undefined per i moduli e ci sarà sicuramente un incendio quando si tenta di utilizzare il pacchetto che richiede tale file. Tuttavia, questo approccio manca del sovraccarico di tracciamento del percorso del file (che sarebbe davvero trascurabile) e non “spreca tempo” cercando in altri bundle prima di esplodere.

Alcuni esempi: ho manipolato node-browserify / example / api per produrre alcuni bundle e gli esempi di seguito sono le mappe dei moduli di vari test, in qualche modo formattate per la leggibilità.

Vanilla – eseguito come nel repository di browser:

 { 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) dipende da ./foo che è a 2

2 (foo.js) dipende da ./bar che è a 1

1 (bar.js) non ha dipendenze

Contrassegnato api/bar.js come esterno:

 { 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) dipende da ./foo che è a 1

1 (foo.js) dipende da ./bar che dovrebbe essere etichettato /browser/bar.js in qualche altro pacchetto

Contrassegnato api/bar.js da escludere:

 { 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) dipende da ./foo che è a 1

1 (foo.js) dipende da ./bar che è in ZOMFG! Non so dove sia. yru richiede ??! 1!

Rimossa la chiamata di esclusione / esterna e rimosso il ./bar di ./bar da 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) dipende da ./foo che è a 1

1 (foo.js) non ha dipendenze, il mondo è peachy. Mi chiedo se hanno caricato bar con altri mezzi

Anche la prima parte della risposta di @ Will è importante:

Per il tuo caso d’uso, probabilmente non avrai bisogno di jQuery, quindi non importa quale usi

Penso che l’esempio dell’OP sia fonte di confusione nel chiedere la differenza tra l’esclusione e l’esterno. Se jQuery non è mai richiesto () – nel codice, allora non ci sono domande: non verrà mai analizzato da browserify e dovrà comunque essere caricato con altri mezzi.

Volevo solo farlo notare perché ho trovato anche questo confuso.