I've converted a javascript application into typescript, yet now that I've converted my code to typescript/es6-style exports, babel/webpack aren't exporting them correctly.
Since I now use the export default...
syntax, babel turns it into an esModule
object with the class actually attached to a default
property.
Naturally, this object format is no longer valid for anyone actually using it.
I've tried adding the babel-plugin-add-module-exports plugin to the mix but it hasn't changed anything. I'm wondering if typescript being in the mix has caused an issue.
.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 just exports a class:
export default class MyApp {...
You could convert the bundle output to a global variable . Currently libraryTarget
points to UMD which supports Commonjs and AMD
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.