所以我将Typescript
与Webpack
一起使用。
tsc
编译从.ts
到.js
的所有内容,然后我想使用webpack
使其可供浏览器使用。但问题是我仍然拥有.js
所有这些tsc
个文件。
有没有办法告诉webpack
:
“将所有这些东西打包成一个漂亮的捆绑包,并在你完成后销毁它们!”
答案 0 :(得分:3)
是的,请使用typescript loader for webpack.
该页面的Configuration section提供了一个示例webpack配置
module.exports = {
entry: './app.ts',
output: {
filename: 'bundle.js'
},
resolve: {
// Add `.ts` and `.tsx` as a resolvable extension.
extensions: ['.ts', '.tsx', '.js'] // note if using webpack 1 you'd also need a '' in the array as well
},
module: {
loaders: [ // loaders will work with webpack 1 or 2; but will be renamed "rules" in future
// all files with a `.ts` or `.tsx` extension will be handled by `ts-loader`
{ test: /\.tsx?$/, loader: 'ts-loader' }
]
}
}
作为第二个真实世界的例子,这里是我个人webpack.config.js的相应部分,它也设置了babel和(p)反应
module: {
rules: [
{
test: /\.ts(x?)$/,
exclude: /node_modules/,
use: [
{
loader: 'babel-loader',
query: {
presets: ['es2015']
}
},
'ts-loader'
]
}
]
},
resolve: {
modules: [
__dirname,
'node_modules'
],
extensions: ['.ts','.tsx','.js'],
alias: {
'react': 'preact-compat/dist/preact-compat.js',
'react-dom': 'preact-compat/dist/preact-compat.js'
}
},