Typescript issue after updating to create-react-app 4.0.0

Question

I have just updated create-react-app to 4.0.0 and I have encountered many issues. The first one was

TypeError: Cannot add property noFallthroughCasesInSwitch, object is not extensible

I solved it by adding "noFallthroughCasesInSwitch": true, to my tsconfig.json

Now I'm able to start the app, but everything went just wrong. I have millions of apparently unsued variables, even though they are not.

I have updated typescript to 4.0.5 but the problem remains.

Also, my machine becomes very loud when I hit yarn start

Are you using prettier or some kind of linter like eslint? Can you show your package.json — ricardo-dlc
– ricardo-dlc, Commented Nov 2, 2020 at 20:25
did you cleared your cache when updated create-react-app some old cache package conflict sometimes after updates — Chandan
– Chandan, Commented Nov 5, 2020 at 5:40
Did you ever resolve this issue? I'm experiencing the same for all types/interfaces imported. — curly_brackets
– curly_brackets, Commented Jan 14, 2021 at 10:10
@curly_brackets Unfortunately no, we gave up on it for now, we reversed the upgrade. — TeaNyan
– TeaNyan, Commented Jan 14, 2021 at 12:24
i have this same issue after upgrading react-scripts v4 in one of our workspaces. not sure how to fix and don't really want to turn the rule off. — KFE
– KFE, Commented Mar 25, 2022 at 18:42

Đỗ Nhật Quang · Accepted Answer · 2020-11-05 03:06:27Z

3

+25

you can temporarily turn off eslint error no-unused-vars and @typescript-eslint/no-unused-vars in file .eslintrc. For example

{
  "extends": [
    "react-app",
    "./node_modules/react-redux-typescript-scripts/eslint.js"
  ],
  "rules": {
    "camelcase": "off",
    "import/no-anonymous-default-export": "off",
    "@typescript-eslint/camelcase": "off",
    "no-unused-vars": "warn",
    "@typescript-eslint/no-unused-vars": "off",
    "@typescript-eslint/ban-ts-ignore": "off",
    "@typescript-eslint/ban-ts-comment": "off",
    "@typescript-eslint/no-empty-function": "off",
    "@typescript-eslint/explicit-module-boundary-types": "off",
    "@typescript-eslint/no-empty-interface": "off",
    "@typescript-eslint/ban-types": "off"
  }
}

answered Nov 5, 2020 at 3:06

Đỗ Nhật Quang

8526 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Typescript issue after updating to create-react-app 4.0.0

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related