如何使用webpack访问全局对象(窗口)? [英] How do I access the global object (window) using webpack?
问题描述
我正在尝试使用ExternalInterface和webpack将ActionScript与JavaScript接口.
I'm trying to interface ActionScript with JavaScript using ExternalInterface and webpack.
ExternalInterface仅可激发(call)在全局对象(window)上找到的功能.如何在window(全局对象)上获取webpack模块引用?
ExternalInterface can only provoked (call) functions found on the global object (window). How can I get a webpack module reference on window (global object)?
允许我详细说明一下，我想为公司(window.companyName)提供一个命名空间，并带有一个ExternalInterface的接口:
Allow me to elaborate some, I want to have a namespace for the company (window.companyName) with an interface for ExternalInterface:
window.companyName = { isReady: function() { ... },
driver1: function() { ... },
driver2: function() { ... } }
ActionScript将驱动我的JavaScript.更根本的问题是，如何使用webpack设置全局变量，以便ExternalInterface可以看到它们(最好是模块的导出)?
The ActionScript will drive my JavaScript. The more fundamental question is, how do I set globals using webpack so that ExternalInterface can see them (preferably as exports of a module)?
我尝试使用expose-loader，exports-loader imports-loader没有运气.理想情况下，expose-loader是我所需要的，但似乎没有用.当我在模块中设置window.companyName并尝试在chrome控制台中对其进行验证时，结果为undefined.
I've tried using expose-loader, exports-loader imports-loader with no luck. expose-loaderis ideally what I need, but doesn't seem to work. When I set window.companyName in my modules and try to verify it in my chrome console, it results in undefined.
推荐答案
您不使用webpack-dev-server吗?
因为当我尝试使用webpack命令时，一切工作正常.我正在通过chrome开发人员工具中输入window.mySampleGlobalVariable对其进行测试.
Because when I try webpack command everything is working fine. I'm testing it by typing window.mySampleGlobalVariable in chrome developer tools.
但是，当我运行webpack-dev-server命令时，我的窗口变量未定义.
BUT when I run webpack-dev-server command then my window variable is undefined.
我有这个示例应用程序:
I have this sample app:
app.js
window.mySampleGlobalVariable = 'TEST';
console.log('App is ready');
index.html
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Webpack test</title>
</head>
<body>
Webpack test
<script src="bundle.js"></script>
</body>
</html>
webpack.config.js
var path = require('path');
module.exports = {
entry: './app.js',
output: {
filename: './bundle.js'
},
resolve: {
extensions: ['', '.js']
}
};
这篇关于如何使用webpack访问全局对象(窗口)?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
