2017-03-06 48 views
0

我試圖使用Webpack 2和TypeScript將對象暴露給全局上下文。這個變量需要全局訪問,因爲它將接收來自外部腳本的命令和屬性,所以它不能存在於其封閉的上下文中。Webpack 2:公開變量到全局上下文,並在同一個項目中使用它

我看到this question,它教會了我如何通過output.library配置輸出一個包。

這裏是我的webpack.config文件:

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

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

fluxCapacitor.ts文件:

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

控制/ index.ts文件:

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

我現在面臨的問題是fluxCapacitor類是全局可用的,但實例myFlux不是。現在myFlux被困在控制上下文中,我無法使用瀏覽器控制檯訪問它。

我也嘗試添加變量到window對象,但打字稿根本不會讓我:

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

問:

什麼是揭露一個變量的最簡單/最簡單的方法到Webpack的捆綁上下文中到全局範圍?

回答

1

對於一個類的實例,只要做你正在做的類同樣的事情 - 導出:

myFlux.ts

import fluxCapacitor from './fluxCapacitor'; 

export default fluxCapacitor.default(); 

webpack.config.js

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

and myFlux will end up on window obje克拉。

相關問題