Some typescript features not supported

[d07RiV]

Describe the bug

Typescript is not parsed correctly in some cases. CRA is suggesting adding babel plugins, which is not possible without eject (?)

Did you try recovering your dependencies?

Tested on a fresh CRA install, so no.

Which terms did you search for in User Guide?

(Write your answer here if relevant.)

Environment

Environment Info:

current version of create-react-app: 5.0.1
running from ~~~\npm\node_modules\create-react-app

System:
OS: Windows 10 10.0.19045
CPU: (16) x64 AMD Ryzen 7 3800X 8-Core Processor
Binaries:
Node: 16.16.0 - C:\Program Files\nodejs\node.EXE
Yarn: Not Found
npm: 8.11.0 - C:\Program Files\nodejs\npm.CMD
Browsers:
Chrome: Not Found
Edge: Spartan (44.19041.1266.0), Chromium (113.0.1774.50)
Internet Explorer: 11.0.19041.1566
npmPackages:
react: ^18.2.0 => 18.2.0
react-dom: ^18.2.0 => 18.2.0
react-scripts: 5.0.1 => 5.0.1
npmGlobalPackages:
create-react-app: Not Found

Steps to reproduce

1. Install fresh version of CRA

2. Run npx create-react-app ts-test --template typescript

3. Insert following code into App.tsx

   class Foo {
   declare x: number
   }

Expected behavior

The code is valid Typescript and compiles in TS playground, I would expect CRA to build it as well, without having to eject and edit config.

Actual behavior

Error:

ERROR in ./src/App.tsx
Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: ~~~\ts-test\src\App.tsx: TypeScript 'declare' fields must first be transformed by @babel/plugin-transform-typescript.
If you have already enabled that plugin (or '@babel/preset-typescript'), make sure that it runs before any plugin related to additional class features:
- @babel/plugin-proposal-class-properties
- @babel/plugin-proposal-private-methods
- @babel/plugin-proposal-decorators
  4 |
  5 | class Foo {
> 6 |   declare x: number
    |   ^^^^^^^^^^^^^^^^^
  7 | }
  8 |

Reproducible demo

As mentioned above, it fails on a fresh CRA project.