I want to use ts only as a form for type-check, so I use babel-loader and add only typescript-preset as shown below. It is not applied when writing the .babelrc file, but it is applied only if you give the option inside the babel-loader inside the webpack.config.js file like this. When I read the official documentation, I understood that babel-loader automatically recognizes and applies the .babelrc file. Am I wrong?
.babelrc
{
"env": {
"development": {
"presets": ["@babel/preset-env"],
"plugins": []
},
"production": {
"presets": [
[
"@babel/preset-env",
{
"targets": { "ie": 11 }
}
],
"@babel/preset-typescript"
],
"plugins": [["@babel/plugin-transform-runtime", { "corejs": 3 }]]
}
}
}
There are many things that can go wrong and without direct access to your setup it's pretty hard to rule simple things out (like .babelrc
being in the wrong directory).
However, if you are running babel-loader version 7.1.1 or earlier, then it's very possible that you've run into a bug where babel.transform
did not read the .babelrc
file correctly by default.
There are two solutions:
The bug was patched in 7.1.2 and 7.1.4 onward.
babelrc: true
to your webpack optionsIf you can't upgrade for some reason, then you simply need to explicitly tell babel.transform
to look for a babel config file:
//...
{
loader: 'babel-loader',
options: {
babelrc: true,
}
}
// ...