Question

我正在尝试使用Webpack 2和TypeScript将对象公开给全局上下文。此变量需要全局可访问，因为它将从外部脚本接收命令和属性，因此它不能存在于其封闭的上下文中。

我看到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");
    }
}

control / index.ts文件：

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

我现在遇到的问题是全局可以使用fluxCapacitor类，但实例myFlux不是。现在myFlux被困在控制上下文中，我无法使用浏览器控制台访问它。

我也尝试将变量添加到window对象，但TypeScript根本不会让我：

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

问题：

在Webpack的捆绑上下文中，将变量公开给全局范围的最简单/最简单的方法是什么？

Answer 1

对于一个类实例，只需要为该类做同样的事情 - 导出它：

<强> myFlux.ts

import fluxCapacitor from './fluxCapacitor';

export default fluxCapacitor.default();

<强> webpack.config.js

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

和myFlux将以window对象结束。

Webpack 2：将变量公开给全局上下文，并在同一个项目

1 个答案: