react ts-loader not working with babel loader webpack

Question

Trying to use ts-loader with my webpack configuration, but I keep getting errors on the terminal when I try to build.

ERROR in ./src/index.ts 4:12
Module parse failed: Unterminated regular expression (4:12)
File was processed with these loaders:
 * ./node_modules/ts-loader/index.js
You may need an additional loader to handle the result of these loaders.
| var ROOT_ID = 'main';
| var App = function () {
>     return />;
| };
| var root = createRoot(document.getElementById(ROOT_ID));

ERROR in ...\client\src\index.ts
./src/index.ts 7:10-11
[tsl] ERROR in ...\client\src\index.ts(7,11)
      TS1005: '>' expected.

ERROR in ...\client\src\index.ts
./src/index.ts 7:11
[tsl] ERROR in ...\client\src\index.ts(7,12)
      TS1161: Unterminated regular expression literal.

...

ERROR in ...\client\src\index.ts
./src/index.ts 12:13-16
[tsl] ERROR in ...\client\src\index.ts(12,14)
      TS2749: 'App' refers to a value, but is being used as a type here. Did you mean 'typeof App'?

...
...

ERROR in ...\client\src\containers\home.ts
2:22-42
[tsl] ERROR in ...\client\src\containers\home.ts(2,23)
      TS2307: Cannot find module 'components/theatre' or its corresponding type declarations.

My file structure

 - Client
   |> babel.config.json
   |> tsconfig.json
   |> webpack.common.js
   ... other files

Babel config json

{
  "presets": ["@babel/preset-env", "@babel/preset-react", "@babel/preset-typescript"],
  "plugins": ["babel-plugin-styled-components"]
}

tsconfig.json

{
  "compilerOptions": {
    "allowJs": true,
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "jsx": "react",
    "module": "es6",
    "moduleResolution": "node",
    "noImplicitAny": true,
    "outDir": "../static/js",
    "sourceMap": true,
    "target": "es5"
  }
}

webpack.common.js

module.exports = {
  entry: ["./src/index.ts"],
  output: {
    filename: 'bundle.js',
    path: path.join(some path)
  },
  resolve: {
    extensions: [".js", ".ts", ".tsx"] 
  },
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        use: 'ts-loader',
        exclude: /node_modules/
      },
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: "babel-loader"
      }
    ]
  },
  ...
}