Parsing error: Cannot read property 'map' of undefined after upgrade to Typescript 4.0.2

[tcatkins99]

I am reporting an issue with

• TypeScript definitions (Maybe?)
• another resource in this repository

Upgrading a react project to Typescript 4.0.2 causes an issue with either esri-loader or the JS typings (not sure which, exactly) and results in the error Line 0: Parsing error: Cannot read property 'map' of undefined. Reverting to Typescript 3.9.7 resolves the issue.

• Describe your environment/framework and be specific with version numbers:
  • Node 14.8
  • React 16.13.1
  • Typescript 4.0.2
  • JS API typings 4.16.0
  • macOS 10.15.6
  • VS Code 1.48.1
  • Project initialized using yarn create react-app my-app --template typescript

Actual behavior

As soon as one does anything with the API, even as simple as importing a type, e.g. type esriModules = [typeof import("esri/tasks/support/Query")]; results in the error noted above.

Steps to reproduce the behavior

Init a new typscript project using create-react-app and upgrade Typescript to 4.0.2. If using VS Code, set the project's Typescript version to 4.0.2 and restart VS Code and the error will manifest. To resolve, install typescript@3.9.7 and set VS Code's typescript version to 3.9.7, delete the node_modules/.cache folder and restart VS Code.

Initially I thought this was an issue with the esri-loader module, but now I'm not so sure since the error results even when just importing a type.

Demo repo here: https://github.com/BDGeo/loadmodules-issue

Thanks.

[tcatkins99]

Looks like this may be an issue with create-react-app: facebook/create-react-app#9515

[tcatkins99]

See facebook/create-react-app#9583 for a workaround. Basically if you are using Create React App it's using older versions of Eslint that break with Typescript 4. Workaround is to downgrade to Typescript 3.9.7 or add selective dependency resolutions in your package.json per the above referenced link. I think it was just a quirk that made it appear to be related to the Esri JS API.