Javascript 导出Web包和Babel不起作用的类

我有一个非常简单的设置与网页和巴贝尔为一个小图书馆

在此之前，我使用以下体系结构生成库的ES5版本：

module.exports.lib = (function () {
    /* private part of library here */

    return {
        ... /* public part of library here */
    }
})();

通过这种方式，一切都很好，我甚至在我的库中有一些ES6功能，比如箭头函数，一切都正常。然而，我决定将我的方法改为ES6课程，方法如下：

export default class Library {

}

现在，当我试着做：

var library = new Library();

我知道库没有定义。即使只是计算

库

也会返回未定义的结果

因此，我所做的是将使用库的文件转换为一个ES6文件，该文件从“libraryfile.js”导入库，并且再次工作

然而，我真的希望我的输出库仍然可以像以前一样使用带有

标记的常规ES5。这可能吗

这是我的网页包配置文件：

module.exports = {
  entry: {
    pentagine: "./lib/pentagine.js",
    demos: ["./demos/helicopter_game/PlayState.js"]
  },

  output: {
    path: __dirname,
    filename: "./build/[name].js",
    libraryTarget: 'umd'
  },

  module: {
    loaders: [
      {
        test: /.js$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
        query: {
          presets: ['es2015']
        }
      }
    ]
  }
};

---

默认导出存储在模块的

Default

属性中。如果您想让用户不必知道就可以访问您的库，您可以将您的网页条目文件更改为

module.exports = require('./libraryfile').default;

---

另外，请确保您的网页包配置中有符合webpack.github.io/docs/configuration.html输出库的

库：“YourLibraryName”

。

网页包已经发生了很大的变化，现在您可以得到与Felix Kling答案相同的结果，但有了网页包配置。您应该在输出配置中添加libraryExport键，并将其设置为“默认值”。这会将主类设置为库的根内容。这是你的电话号码

您的网页包配置应如下所示：

module.exports = {
  entry: {
    pentagine: "./lib/pentagine.js",
    demos: ["./demos/helicopter_game/PlayState.js"]
  },

  output: {
    path: __dirname,
    filename: "./build/[name].js",
    libraryTarget: 'umd',
    libraryExport: 'default' //<-- New line
  },

  module: {
    loaders: [
      {
        test: /.js$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
        query: {
          presets: ['es2015']
        }
      }
    ]
  }
};

module.exports={
条目：{
pentagine:“./lib/pentagine.js”，
演示：[“/demos/helposer_game/PlayState.js”]
},
输出：{
路径：_dirname，
文件名：“./build/[name].js”，
图书馆目标：“umd”，
libraryExport:'默认'/'但是，我真的希望我的输出库仍然是有效的ES5。这可能吗Babel已经做到了…@FelixKling是的，它是有效的ES5，但我想我的意思是，我希望它能被带有普通脚本标记的常规ES5代码使用。我会编辑这个问题。这可能会有所帮助：我学到了很多，但它似乎与使用
添加模块导出
插件没有解决问题是同一个问题。di你解决了这个问题吗？我也面临着同样的错误？听起来很公平，所以我创建了一个
entry.js
，其中唯一的代码是
module.exports=require（'./pentagine.js'））.default；
。我将webpack中的条目文件更改为
entry.js
，但仍然没有定义。
pentagine.js
是否有默认导出？是的，
导出默认类pentagine
就是它。（您可以在这里看到）我想你还需要在你的网页配置中使用
library:'YourLibraryName'
。
library:'YourLibraryName'
在第4网页中被删除