search

facebook / create-react-app

Set up a modern web app by running one command.
https://create-react-app.dev
MIT License
102.52k stars 26.78k forks source link

[v5] Use ts loader and ts-jest for typescript transpilation #11247

Open raix opened 3 years ago

raix commented 3 years ago

Is your proposal related to a problem?

When developing typescript applications it would be great to use typescript compiler instead of babel transform etc. to better respect the tsconfig.

A similar aspect is the missing typechecking of test / jest files again moving to ts-jest would greatly improve the DX in this area for TypeScript developers (ts-jest loaders configured with the same babel presets as the actual build...)

Describe the solution you'd like

  1. use ts-loader for transformation (keeping fork-ts-checker for the typechecking)
  2. use ts-jest for transformation and type checking in tests (with babel configured)
  3. Reduce babel for typescript files to do babel env/react and for now fast-refresh

Describe alternatives you've considered

We already use babel as the alternative, would only consider those two

Additional context

raix commented 3 years ago

cc. @arogozine added this issue for tracking better support for typescript in CRA

raix commented 3 years ago

(or use the swc-loader to replace both babel and typescript loaders)

Nedlinin commented 3 years ago

I'm not sure swc-loader respects tsconfig at all though the switch would probably improve compilation speeds a good bit.

keropodium commented 3 years ago

I'm not sure swc-loader respects tsconfig at all though the switch would probably improve compilation speeds a good bit.

No, currently it doesn't. See this.

InSuperposition commented 3 years ago

This comment lists a few more options for using SWC with a tsconfig file. https://github.com/swc-project/swc/issues/1348#issuecomment-902700083

Parcel's v2 branch uses swc (along with babel) and has a few plugins to replace their babel plugin counterparts

Babel v SWC features SWC vs babel vs tsc benchmarks

Bnaya commented 2 years ago

TL; DR; What are you missing from the tsconfig? :)

I haven't benchmarked it, but i feel it will make typescript transpilation slower as you will pass it through 2 loaders and not only babel.

Also, using ts-loader + transpileOnly still does not support 100% of possible tsconfig settings (no const enums etc). You might get projects references support.

What other parts of the tsconfig you have in mind?

And a general note regarding typescript performance: While the DX is not ideal, running TSC in a separate terminal tab/process will be faster and more regressions proof than even using fork-ts-checker

tsc is the reference implementation of all of the new stuff and it's performance are beaning monitored directly by the typescript team as part of their workflow, while tools like ts-loader & fork-ts-checker are maybe using the same apis internally, it took them long time to get a PR from someone in the typescript team to get incremental builds ,project references, and still they had issues compare to tsc.

raix commented 2 years ago

@Bnaya in babel you have to add certain plugins rather than just using the tsconfig... Regarding jest having the same transpilation and typechecking is great for consistency and DX

Bnaya commented 2 years ago

But CRA abstracts that away from you All of babel is made of plugins, and it's preconfigured for you.

Regarding DX I tend to agree, but due to performance reasons and toolchain complexity I wound't go there

osddeitf commented 2 years ago

Is that issue preventing v5 to be released?

raix commented 2 years ago

Nope - v5 is very close for a release, just some hickup with node 17 and latest webpack breaking tests afaik

dima-vakatsiienko commented 2 years ago

Do not use babel, use SWC in V5.

marcandrews commented 2 years ago

Support for project references would be really nice.