web-dev-qa-db-ja.com

Create React App and TypeScriptを使用してオプションのチェーンを有効にする方法

実験的な構文 'optionalChaining'のサポートは現在有効になっていません

上記のエラーが発生しました。私はこれを post に従って、devDependenciesに"@babel/plugin-proposal-optional-chaining": "^7.7.4"を追加しました。

次に、このエラーが発生します、

@ babel/plugin-proposal-optional-chaining（ https://git.io/vb4Sk ）をBabel構成の 'plugins'セクションに追加して、変換を有効にします。

だから私はこれに従いました post と.babelrcファイルをプロジェクトのルートに追加しました

{
    "presets": ["react", "es2015","stage-1"],
    "plugins": ["transform-runtime", "transform-optional-chaining"]
}

これは何もしなかったようです。誰かがCreate React Appではbabelの設定を変更できないと言っていることも聞きました。だから私の質問は、CRA全体を再配線せずにオプションの連鎖を有効にするにはどうすればよいですか？

P.S。私は"TypeScript": "^3.7.2"を使用しています。または、少なくともpackage.jsonはそれを使用しています。更新されるようにnpm installを試しました。 CRAの下で奇妙なことをして、何らかの形で古いバージョンのTypeScriptを使用しているかどうかはわかりません。

EDIT：CRAでプロジェクトを開始したとき、TypeScript: 3.6.xを使用していたと思います。 Optional Chainingを使用したかったので、package.jsonファイルを"TypeScript": "^3.7.2"、次にnpm installに変更しました。問題はTypeScriptが3.7.2を使用していることを知っていると思いますが、CRAにはまだ古い設定があり、それをどのように更新できるかわかりません。

typescriptbabelcreate-react-app
11
Hafiz Temuri

Create-React-Appは、babelを使用してTypeScriptをトランスパイルするため、npmがインストールされているバージョンのTypeScriptを使用しません。 react-scriptsのバージョン3.3.0はTypeScript 3.7をサポートしています。あなたはそれをインストールして、それを以下で使うことができます：

10
LukeP

Reactスクリプト3.3.0以降でサポートされています。 react-scripts @ nextをインストールする必要はありません。

Package.json "react-scripts": "^3.3.0"と動作します。

5
Elisha Sterngold

package.json

{
  "scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test --env=jsdom"
  },
  "devDependencies": {
    "@babel/plugin-proposal-optional-chaining": "^7.2.0",
    "customize-cra": "^0.4.1",
    "react-app-rewired": "^2.1.3"
  }
  ...other
}

config-overrides.js

const { useBabelRc, override } = require('customize-cra');
module.exports = override(useBabelRc());

。babelrc

{
  "plugins": ["@babel/plugin-proposal-optional-chaining"]
}

詳細なブログ投稿

2
Medet Tleukabiluly