Typescript templates not compiling

[jfacchini]

Describe the bug I just created a new App using the Typescript template but I'm getting the following compilation error

❯ yarn tsc --noemit
error TS5070: Option '--resolveJsonModule' cannot be specified without 'node' module resolution strategy.

node_modules/@tsconfig/create-react-app/tsconfig.json:9:25 - error TS6046: Argument for '--moduleResolution' option must be: 'node', 'classic', 'node16', 'nodenext'.

9     "moduleResolution": "bundler",
                          ~~~~~~~~~


Found 2 errors in the same file, starting at: node_modules/@tsconfig/create-react-app/tsconfig.json:9

Upon investigation it seems this error has been introdued by the @tsconfig/create-react-app package to version >= 2, but this configuration expect a version of Typescript >= 5 which accepts the value bundler for the moduleResolution config.

I've tried to update typescript dependency to version 5.1.6 and I'm not getting any compilation error and it seems to be running fine in development mode.

To Reproduce Steps to reproduce the behavior:

1. npx create-contentful-app my-app
2. select Template
3. select Typescript
4. cd my-app
5. npx tsc --noemit

[ghepting]

what's the reason for running npx tsc --noemit vs npm start or npm run build which uses react-scripts to compile? AFAIK tsc always compiles with the compiler defaults (source from docs: https://www.typescriptlang.org/docs/handbook/compiler-options.html) and doesn't respect the tsconfig

[jfacchini]

Thanks for your answer. I'll answer to your question first then highlight the source documentation.

I used tsc to verify the errors I could see on my IDE (using Intellij) as shown in this image (Granted that it is a different error here.):

I'd like to add a note that it was workikng fine when I created a project from template a bit before the 23/06

The link you are referencing specifies that: When input files are specified on the command line, tsconfig.json files are ignored. and the first example being

# Run a compile based on a backwards look through the fs for a tsconfig.json
tsc

As I understand this would mean that tsc would use the tsconfig.conf in the root directory, is that correct? (Apologies if I'm wrong)

[ghepting]

I think this might fix this, but waiting to get some input from others @ Contentful since I'm by no means an expert in the typescript compiler :D https://github.com/contentful/apps/pull/4173

[jfacchini]

Thanks @ghepting , I'll update my local version, bringing typescript back to version 4.x and use the moduleResolution NodeNext

[lilbitner]

Hello @jfacchini. Thank you for raising this issue, and I know it has been a while since we checked back - has everything be resolved on your end? If so, I will go ahead and close the issue.

[jfacchini]

Hi @lilbitner, sorry for my late response. I've just stumbled upon the exact same problem today. And again the solution for me was to update the version of typescript to version 5.

Having a look at the ts-config file https://github.com/contentful/apps/blob/master/examples/typescript/tsconfig.json#L2 I notice the config comes from this file: https://github.com/tsconfig/bases/blob/main/bases/create-react-app.json#L9

This moduleResolution is not supported by typescript before version 5.