Ido*_*man 2 javascript webpack
我是 webpack 的新手，无法弄清楚如何将类构造函数公开给浏览器的全局命名空间。例如，如何配置 webpack 使下面的代码在控制台中打印“hello world”？我试过使用exports-loader, expose-loader, 并script-loader没有成功。
主文件
class MyClass {
print() {
console.log('hello world');
}
}
索引.html
<!DOCTYPE html>
<html>
<head></head>
<body>
<script src="./dist/bundle.js"></script>
<script>
myClass = new MyClass;
myClass.print();
</script>
</body>
</html>
您可以：
a) 显式公开您的函数（类）：
主文件
class MyClass {
print() {
console.log('hello world');
}
}
window.MyClass = MyClass;
然后你可以通过MyClass直接引用从全局对象调用你的构造函数。
b) 配置 webpack 以在全局对象中公开您的导出，如下所示：
webpack.config.js
module.exports = {
output: {
library: 'someName',
libraryTarget: 'umd',
globalObject: 'this'
}
}
然后，您可以通过library在上述配置文件中配置为选项的全局变量中引用导出的函数（类）来调用构造函数。在这个例子中someName.MyClass。为此，您必须在 main.js 文件中导出函数，如下所示。
主文件
export class MyClass {
print() {
console.log('hello world');
}
}
更多细节请参考webpack 输出配置。
| 归档时间： |
|
| 查看次数： |
1432 次 |
| 最近记录： |