I'm getting this error:
ERROR in ./assets/scripts/helpers/react-form.ts 7:26
Module parse failed: Unexpected token (7:26)
File was processed with these loaders:
* ./node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
| import { arrayIncludes, arrayRemove, toBool } from "../kb";
| export var Store = /*#__PURE__*/function () {
> function Store(readonly data, readonly setData, readonly initialData) {}
|
| var _proto = Store.prototype;
The actual source code around that line looks like:
export class Store<T extends Record<string,any>=Record<string,any>> {
constructor(readonly data: T, readonly setData: Setter<T>, readonly initialData: T) {}
So it is transforming it a little bit but it doesn't seem to be dropping the readonly for some reason. My babel config looks like:
{
"browserslistConfigFile": ".browserslistrc",
"plugins": [
["@babel/plugin-proposal-decorators", { "legacy": true }]
],
"presets": [
"@babel/preset-typescript",
["@babel/preset-env", {
"useBuiltIns": "entry",
"shippedProposals": true,
"corejs": "3.25.1",
"modules": false,
"loose": true
}]
],
"env": {
"development": {
"plugins": [
"react-refresh/babel"
],
"presets": [
["@babel/preset-react", {"development": true}]
]
},
"production": {
"plugins": [
"@babel/plugin-transform-react-constant-elements",
"babel-plugin-unassert"
],
"presets": [
["@babel/preset-react", {"development": false}]
]
}
}
}
i.e. @babel/preset-typescript should be taking care of the TypeScript transformation, and @babel/preset-env should be taking care of the rest. What's the issue here?
It was working fine in Webpack 4 but then I upgraded a ton of packages and something broke (including changing to Webpack 5), but I'm not sure where to look now.
Also my tsconfig:
{
"compilerOptions": {
"experimentalDecorators": true,
"strict": true,
"noImplicitAny": true,
"strictNullChecks": true,
"strictFunctionTypes": true,
"strictBindCallApply": true,
"strictPropertyInitialization": true,
"noImplicitThis": true,
"alwaysStrict": true,
"noImplicitReturns": true,
"pretty": true,
"module": "esnext",
"suppressImplicitAnyIndexErrors": false,
"lib": [
"ESNext",
"dom"
],
"skipLibCheck": false,
"target": "es2018",
"declaration": false,
"resolveJsonModule": false,
"esModuleInterop": true,
"jsx": "react-jsx",
"moduleResolution": "node",
"allowSyntheticDefaultImports": true,
"noEmit": true,
"allowJs": true,
"isolatedModules": true
},
"include": [
"assets/scripts/**/*.ts",
"assets/scripts/**/*.tsx",
],
"exclude": [
"assets/scripts/libs"
]
}