Deployment fails due to build error (TypeError: Cannot add property target, object is not extensible)

[reflash]

🐛 bug report

Preflight Checklist

• I have read the
  Contributing Guidelines
  for this project.
• I agree to follow the
  Code of Conduct
  that this project adheres to.
• I have searched the issue tracker for an issue that matches the one I want
  to file, without success.

Description of the problem

Deploying to both Vercel and Netlify fails due to the following error

14:47:58.390 | Running "yarn run build"
-- | --
14:47:58.570 | yarn run v1.22.10
14:47:58.582 | warning package.json: No license field
14:47:58.593 | $ react-scripts build
14:47:59.011 | /vercel/path1/node_modules/react-scripts/scripts/utils/verifyTypeScriptSetup.js:231
14:47:59.012 | appTsConfig.compilerOptions[option] = suggested;
14:47:59.013 | ^
14:47:59.013 | TypeError: Cannot add property target, object is not extensible
14:47:59.013 | at verifyTypeScriptSetup (/vercel/path1/node_modules/react-scripts/scripts/utils/verifyTypeScriptSetup.js:231:45)
14:47:59.013 | at Object.<anonymous> (/vercel/path1/node_modules/react-scripts/scripts/build.js:31:1)
14:47:59.013 | at Module._compile (internal/modules/cjs/loader.js:1063:30)
14:47:59.013 | at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
14:47:59.013 | at Module.load (internal/modules/cjs/loader.js:928:32)
14:47:59.013 | at Function.Module._load (internal/modules/cjs/loader.js:769:14)
14:47:59.013 | at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:72:12)
14:47:59.013 | at internal/main/run_main_module.js:17:47
14:47:59.030 | error Command failed with exit code 1.

How has this issue affected you? What are you trying to accomplish?

Trying to deploy my sandbox to Vercel

To Reproduce

Fails with default react + typescript sandbox

Link to sandbox: link

Your Environment

Software	Name/Version
Сodesandbox
Browser	Chrome
Operating System	Mac OS

[reflash]

Seems the issue is with the template:
facebook/create-react-app#10110
Upgrading CRA to 4.0.1 got this issue fixed

I think template should be fixed, but I can't figure where're they stored - https://github.com/codesandbox/codesandbox-templates seems to contain outdated ones

[lbogdan]

Hey @reflash ,

Thanks for your report, and sorry for the late reply!

We'll take a look at this and get back to you after we upgrade react-scripts in the official React templates.

[VladSez]

@lbogdan i experience the same issue

[lbogdan]

@CompuIves @DeMoorJasper Can you please take a look at this - specifically if it's safe to upgrade react-scripts to latest (4.0.3) in the React TypeScript template?

[VladSez]

@reflash @lbogdan
in react + typescript sandbox

if i install this deps

   "@types/react": "17.0.20",
   "@types/react-dom": "17.0.9",
   "react": "17.0.2",
   "react-dom": "17.0.2",
   "react-scripts": "4.0.3",
   "typescript": "4.4.2"

it successfully deploys to vercel

Link to codesandbox
Link to deployed site

[DeMoorJasper]

Updated the template, so this should be fixed. Feel free to open a new issue if something appears to be broken