Webpack 2: Expose Variable zum globalen Kontext, und verwenden Sie es im selben Projekt

Question

Ich versuche, ein Objekt mit dem globalen Kontext mit Webpack 2 und TypeScript verfügbar machen. Diese Variable muss global zugänglich sein, da sie Befehle und Attribute von einem externen Skript erhält, sodass sie nicht in ihrem eingeschlossenen Kontext vorhanden sein kann.

Ich sah this question, die mir beibrachte, wie man ein Bündel über die output.library Konfiguration ausgibt.

Hier ist meine webpack.config Datei:

entry:{ 
    fluxCapacitor: "./ts/main/fluxCapacitor.ts", 
    control: "./ts/control/index.ts" 
}, 

output:{ 
    path: __dirname + "/js", 
    filename: "[name].js", 
    library: "[name]", 
    libraryTarget: "var" 
}, 

fluxCapacitor.ts Datei:

export default class Core{ 
    constructor(){ 
     console.log("Need more jiggawatts"); 
    } 
} 

control/index.ts Datei:

var myFlux = new (<any>window).fluxCapacitor.default(); 

Das Problem, das ich jetzt habe, ist, dass die Klasse global verfügbar ist, die Instanz jedoch nicht. Jetzt ist myFlux im Steuerungskontext gefangen, und ich kann es nicht über die Browserkonsole erreichen.

Ich habe auch versucht die Variable auf das Objekt window hinzufügen, aber Typoskript einfach lässt mich nicht:

window.myFlux = new (<any>window).fluxCapacitor.default(); 
// property 'myFlux' does not exist on type 'Window' 

Frage:

Was die einfachste/einfachste Weg ist, um eine Variable zu belichten aus dem gebündelten Kontext von Webpack?

Answer 1

Für eine Instanz der Klasse, tun genau das gleiche, was Sie gesucht haben, um die Klasse zu tun - exportieren:

myFlux.ts

import fluxCapacitor from './fluxCapacitor'; 

export default fluxCapacitor.default(); 

webpack.config.js

entry:{ 
    ... 
    myFlux: "./ts/main/myFlux.ts", 
    ... 
}, 

und myFlux wird auf dem Spiel window obje Ende ct.