ts-loader vs babel-loader in Typescript using webpack

Question

So I was trying to compare the output compiled code by these 2 combinations.

ts-loader

  {
    test: /\.tsx?$/,
    use: 'ts-loader',
  }

babel-loader

  use: {
      loader: 'babel-loader',
      options: {
        presets:
          [
            "@babel/preset-react",
            "@babel/preset-typescript",
          ]
      }
    }

• I get compiling times for babel-loader lower than for ts-loader.
• Also, ts-loader looks to be using babel under the hood, at least it's in its dependencies.
• Also, babel-loader allows to use cache with cacheDirectory

Questions

1. Is there any way to use cache in ts-loader like the cacheDirectory in babel?
2. Any other benefits in using ts-loader instead of babel-loader?

Answer 1

for your questions:

1. As someone already mentioned, there is an experimental setting in ts-loader to allow cache, you can check out configuration reference for more information: https://github.com/TypeStrong/ts-loader#experimentalfilecaching
2. Afaik babel does not do typechecking on its own, so you would have to run TSC for that. Also it does not support 'const enum' syntax of ts...

Also you can mix the 2, have ts-loader for dev and babel for prod builds.