Help us understand the problem. What is going on with this article?

create-react-app(typescript)が動かんくなった

突然create-react-app (typescript)で作成したプロジェクトが動作しなくなった模様
(この不具合は11/24に対応され、現在は問題は解消されている模様)
https://github.com/facebook/create-react-app/issues/10112

いつものようにプロジェクトを作成

npx create-react-app myapp --template typescript

作成したアプリを起動

cd myapp
yarn start

以下エラーが出る。なぜ?

/Users/hoge/react/myapp/node_modules/react-scripts/scripts/utils/verifyTypeScriptSetup.js:239
      appTsConfig.compilerOptions[option] = value;
                                          ^

TypeError: Cannot assign to read only property 'jsx' of object '#<Object>'
    at verifyTypeScriptSetup (/Users/hoge/react/myapp/node_modules/react-scripts/scripts/utils/verifyTypeScriptSetup.js:239:43)
    at Object.<anonymous> (/Users/hoge/react/myapp/node_modules/react-scripts/scripts/start.js:31:1)
    at Module._compile (internal/modules/cjs/loader.js:778:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)
    at Module.load (internal/modules/cjs/loader.js:653:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
    at Function.Module._load (internal/modules/cjs/loader.js:585:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:831:12)
    at startup (internal/bootstrap/node.js:283:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:623:3)
error Command failed with exit code 1.

解消方法

package.json変更

typescriptを^4.0.3から~4.0.3に変更

image.png

tsconfig.json変更

jsxをreact-jsxからreactに変更
image.png

あとは、yarn.lock削除してからyarn startを実行

とりあえず、これで解消しました。どうしたんだ一体。。。

makishy
クラウドってなに?おいしいの? 個人的な投稿であり、所属する会社、組織とは関係ありません。
kddi
KDDIは、通信を中心に周辺ビジネスを拡大する「通信とライフデザインの融合」をより一層推進し、国内はもとよりグローバルにおいても、5G/IoT時代における新たな価値創造を実現し、お客さまの期待を超える新たな体験価値の提供を追求してまいります。
http://www.kddi.com
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away