Changing compiler target in tsconfig.json does not seem to have any effect

[cam8001]

Describe the bug

When I update my Typescript compilation target to es2017 in tsconfig.json, there does not seem to be any effect.

Did you try recovering your dependencies?

Yes, as per instructions.

» npm --version
6.14.8

Environment

» npx create-react-app --info
npx: installed 92 in 6.354s

Environment Info:

  current version of create-react-app: 4.0.0
  running from /local/home/ctod/.npm/_npx/22463/lib/node_modules/create-react-app

  System:
    OS: Linux 5.4 Amazon Linux 2
    CPU: (8) x64 Intel(R) Xeon(R) Platinum 8124M CPU @ 3.00GHz
  Binaries:
    Node: 12.18.3 - ~/.nvm/versions/node/v12.18.3/bin/node
    Yarn: Not Found
    npm: 6.14.8 - ~/.nvm/versions/node/v12.18.3/bin/npm
  Browsers:
    Chrome: Not Found
    Firefox: support!
Mozilla Firefox 68.6.1esr
  npmPackages:
    react: ^16.13.1 => 16.14.0
    react-dom: ^16.13.1 => 16.14.0
    react-scripts: 4.0.0 => 4.0.0
  npmGlobalPackages:
    create-react-app: Not Found

I can't update to react-scripts 4.0.1 yet as it hasn't been pushed through to our private npm repo (it usually takes a couple of days).

Steps to reproduce

(Write your steps here:)

1. React/Typescript app was previously created with create-react-app --typescript, using create-react-app 3.4.x
2. In src/index.tsx - the entry point to my React app, I have a call to an asynchronous function at the top level:

const thing = await returnsPromise();

3. When running npm run start, I get the error "Cannot use await outside of an async function":

Module parse failed: Cannot use keyword 'await' outside an async function (16:22)
File was processed with these loaders:
 * ./node_modules/@pmmmwh/react-refresh-webpack-plugin/loader/index.js
 * ./node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
|
| const config = new ThingConfig();
> const aConfigThing = await ThingConfig.thing();

4. await at the top level requires a typescript 'target' of 'es2017' or above and a 'module' of 'esnext'.
5. Update tsconfig.json to the following:

{
  "compilerOptions": {
    "target": "es2017",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react"
  },
  "include": [
    "src"
  ]
}

Expected behavior

After changing the target in tsconfig.json, I expected the feature to work.

Actual behavior

After changing the target in tsconfig.json, I get the same compilation failure.

(Write what happened. Please add screenshots!)

[Dylan0916]

any update?

[kiril-daskalov]

Please fix this pain.

[stale[bot]]

This issue has been automatically marked as stale because it has not had any recent activity. It will be closed in 5 days if no further activity occurs.

[kiril-daskalov]

Hello React World! 2022! Please fix this! We are control freaks, please fix this!

[mdibenedetto]

any update?