Webpack 4 + ES6 + Babel 7 =未捕获的TypeError:不是构造函数

时间:2018-10-05 02:27:38

标签: javascript webpack ecmascript-6 babel es6-modules

我正在尝试将Webpack与Babel一起使用来转换要与标签一起使用的模块。 Webpack可以正确转换,但是当我尝试创建一个新实例时却无法正常工作。

我的.babelrc:

{
  "presets": [
    [
      "@babel/env",
      { "modules": false }
    ]
  ],
  "plugins": []
}

我在Webpack上的配置:

{
  test: /\.js$/,
  exclude: /(node_modules|bower_components|coverage)/,
  use: [
    {
      loader: 'babel-loader',
      options: {
        presets: [
          ['@babel/preset-env', { modules: false }]
        ]
      }
    }
  ]
}

JS类的示例是:

class Test {
  constructor(options) {
    this.init = options.init || '';
  }

  someMethod() {
    console.log('Working');
  }
}

在HTML中,我将script标签和脚本调用:

<script src="../dist/test.component.js"></script>
<script>
    var foo = new Test({
        init: "#hello"
    });
</script>

开发人员工具显示以下错误:

  

未捕获的TypeError:测试不是构造函数

我尝试使用Babel或Webpack的某些插件,但是什么也没有。

Webpack的输出配置具有

output: {
  path: path.resolve(__dirname, 'dist'),
  library: 'Test',
  libraryTarget: 'umd',
  umdNamedDefine: true
},

好吧,我不知道发生什么事。

致谢。

0 个答案:

没有答案