I am setting up typescript with webpack, using awesome-typescript-loader
. However webpack is giving me this error on build:
ERROR in ./src/logic/Something.ts
Module parse failed: Unexpected token (2:19) You may need an appropriate loader to handle this file type.
here is a piece of code from webpack.config.js
:
module: {
loaders: [
{
test: /\.(js|jsx)?$/,
loader: "babel-loader",
exclude: /node_modules/
},
{
test: /\.(ts|tsx)?$/,
loader: "awesome-typescript-loader",
exclude: /node_modules/
},
{
test: /\.(css|less)?$/,
use: [{
loader: "style-loader"
}, {
loader: "css-loader?modules&localIdentName=[local]--[hash:base64:5]"
}, {
loader: "less-loader"
}]
},
{
test: /\.json$/,
exclude: /node_modules/,
loader: 'json-loader'
}
]
},
resolve: {
extensions: [".js", ".jsx", ".ts", ".tsx", ".css", ".less"]
}
and tsconfig.json
:
{
"compilerOptions": {
"noImplicitAny": false,
"noEmitOnError": true,
"module": "commonjs",
"removeComments": false,
"sourceMap": true,
"target": "es5",
"jsx": "react"
},
"exclude": [
"node_modules",
"wwwroot"
]
}
UPDATE
Something.ts
file:
class Something {
constructor(str: string) {
console.log(str);
}
}
export { Something };
Do you have any ideas where the issue might be? Thanks!
webpack v3 requires using use
instead of directly writing the loader
rule for loading loaders
.
Do it like this, rather:
{
test: /\.(ts|tsx)?$/,
use: {
loader: 'awesome-typescript-loader'
},
exclude: /node_modules/
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With