如何在带有 ES6 + Webpack 的浏览器中使用我的 Javascript 库？ [复制]答案

【问题标题】：How do I use my Javascript library in the browser with ES6 + Webpack? [duplicate]如何在带有 ES6 + Webpack 的浏览器中使用我的 Javascript 库？ [复制]
【发布时间】：2016-01-04 21:27:53
【问题描述】：

我正在 ES6 中创建一个库，我想从 HTML 中的脚本标签调用它：

class CoolElement {
	constructor() {
      
    }
    init() {
      return document.createElement('div');
    }
}

export default new CoolElement();

<html>
<body>
	<div id="content"></div>
	<script type="module" src="../dist/coolelement.js"></script>
	<script>
		var element = CoolElement.init(); //Error! CoolElement does not exist!
		document.getElementById('content').addChild(element);
	</script>
</body>
</html>

我使用带有 Gulp 的 Webpack 将其转换为 es5 并将其捆绑到 dist 文件夹中。但是当我在页面上需要它时，没有全局 CoolElement 参考。我该怎么做..？

【问题讨论】：

标签： javascript gulp ecmascript-6 webpack

【解决方案1】：

   entry: "./entry.js",
    output: {
        path: __dirname,
        filename: "bundle.js",
        library: "home"
    },

然后在 webpack 配置中添加库：“home”

		var element = home.CoolElement.init();
		document.getElementById('content').addChild(element);

【讨论】：

啊，它对我不起作用，因为我有