Babel打字稿预设无法与React预设一起使用

Question

我正在使用babel react预设将带有JSX文件的React组件转换为JS文件。效果很好！

npm install --save-dev @babel/preset-react

现在我添加了打字稿预设

npm install --save-dev @babel/preset-typescript

两个预设都位于.babelrc中：

{
    "presets": [
        ["@babel/env", {"modules": false }],
        "@babel/preset-typescript",
        "@babel/preset-react"
    ]
}

我将目录添加到tsconfig.json

{
    "compilerOptions": {
        "rootDir": "src",
        "outDir": "docs/js"
    },
    "include": [
        "src/**/*"
    ]
}

但是当我使用

运行Babel时

npx babel src --out-dir prod/js

打字稿预设被忽略。反应预设确实起作用！

如果我在终端中手动调用打字稿预设，它将起作用：

npx babel --presets @babel/preset-typescript src/test.ts

但是现在我的React代码被忽略了。

如何将这两个预设与Babel结合？