Question

我已将javascript应用程序转换为typescript，但现在我已将代码转换为typescript / es6样式的导出，babel / webpack并未正确导出它们。

由于我现在使用export default...语法，因此babel将其转换为esModule对象，该类实际附加到default属性。

当然，这种对象格式对于实际使用它的任何人都不再有效。

我已尝试将babel-plugin-add-module-exports插件添加到混音中，但它没有改变任何内容。我想知道混合中的打字稿是否会引起问题。

.babelrc：

{
    "plugins": [
        "add-module-exports",
        "lodash"
    ]
}

tsconfig.json：

{
  "compilerOptions": {
    "target": "es2015",
    "module": "commonjs"
  }
}

webpack.config.js：

entry: {
    'myfile.ts'
},
output: {
    filename: 'myfile.js',
    library: 'MyApp',
    libraryTarget: 'umd'
},
resolve: {
    extensions: ['', '.ts', '.js']
},
module: {
    loaders: [{
        test: /\.ts$/, loader: 'babel!ts-loader'
    }]
}

myfile.ts只导出一个类：

export default class MyApp {...

Answer 1

您可以将捆绑输出转换为global variable。目前libraryTarget指向支持Commonjs和AMD

的UMD

由babel / webpack导出的Tyepscript / es6模块为_esModule，默认属性

1 个答案: