如何使用 TS 配置 CRA 以支持 nullish-coalescing-operator

所以我开始了一个新的 CRA 项目，我正在使用 TS beta 来获得一些不错的功能，例如链接运算符，但我也想使用nullish-coalescing-operator ifExists ?? elseUseThis

不幸的是它不能开箱即用，并告诉我安装 babel 插件，但将其添加到 .babelrc 后，它仍然无法工作。

有没有办法在 Create React App 中添加此支持？

CRA 不会读取您的信息.babelrc.

不弹出的通常方法是使用这两个包：

npm install --save-dev react-app-rewired customize-cra

更改 package.json 中的脚本部分：

"scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test --env=jsdom",
    "eject": "react-scripts eject"
},

然后你可以安装你喜欢的 babel 插件：

npm install --save-dev @babel/plugin-proposal-nullish-coalescing-operator

然后创建一个config-overrides.js根目录下的文件。

const {override, addBabelPlugin} = require('customize-cra')

module.exports = override(
  addBabelPlugin("@babel/plugin-proposal-nullish-coalescing-operator")
);

CRA 的“内部”混乱将会扩大。

请参阅已安装软件包中的 github 文档以进行进一步调查：

反应应用程序重新连线 https://github.com/timarney/react-app-rewired

定制-cra https://github.com/arackaf/customize-cra尤其是api-docs https://github.com/arackaf/customize-cra/blob/master/api.md（例如传递一系列插件、关于在测试脚本中使用插件的警告......）

我已经用 CRA 新创建的应用程序对此进行了测试，它的工作原理非常神奇。当我使用 Javascript 时，它应该以类似的方式与 Typescript 一起工作。