Gebündelte mehrere Skripte in einem Bundle.js, aber ich habe Probleme mit Variablenzugriff

Question

Ich arbeite an einem Projekt, das für alle Skripts in einer Bundle.js-Datei enthalten sein muss. Das habe ich mit browserify geschafft. Das Problem hierbei ist, dass zwar jedes einzelne Skript, das in der Datei "bundle.js" enthalten ist, den enthaltenen Code perfekt ausführen kann, aber nicht auf globale Variablen aus anderen Skripts zugreifen kann. Wie in diesem Beispiel. Das erste Skript wird perfekt ausgeführt, aber das zweite Skript kann nicht auf die geschnittene Variable zugreifen, obwohl das erste Skript korrekt ausgeführt wurde und natürlich zuerst. Irgendwelche Ideen, wie Sie das beheben können?

Inhalt des first.js Skript:

var a = ['zero', 'one', 'two', 'three']; 
var sliced = a.slice(1, 3); 


function logger() { 
    console.log(a);  // ['zero', 'one', 'two', 'three'] 
    console.log(sliced); // ['one', 'two'] 
    console.log("first.js script executed"); 
}; 

logger(); 

Inhalt des second.js Skript:

console.log(sliced); 

Answer 1

Module globalen Zustand nicht teilen. Sie müssen ein Modul in das andere importieren, genau wie bei einem serverseitigen Knotenscript. Dann geben Sie die geteilten Variablen ein. Beim "Bündeln" mit Browserify geht es darum, diese Importe aufzulösen und die Ergebnisse in einer Datei zu speichern, da der Browser die CommonJS-Import-Syntax nicht versteht.

script.js

let script2 = require('./relative/path/to/script2.js'); 

let a = ['zero', 'one', 'two', 'three']; 
let sliced = a.slice(1, 3); 

function logger() { 
    console.log(a);  // ['zero', 'one', 'two', 'three'] 
    console.log(sliced); // ['one', 'two'] 
    console.log("first.js script executed"); 
}; 

logger(); 
script2(sliced) 

script2.js

function script2PublicFunction (sliced){ 
    console.log(sliced); 
} 

module.exports = script2PublicFunction;