Redwood: Cannot find type definition file for 'types'.

[fveauvy]

I wanted to try using typescript on a newly created Redwood project 0.20.0. I followed the guidance from the typescript page doc and created a page and a component (the component has been created with the --ts option).

I noticed this issue in the Problems tab of vs code.

[fveauvy]

Aside from the notification in the Problems tab, everything seems to be working fine.

I'll try to find why my IDE is displaying this "issue".

[thedavidprice]

Hi @fveauvy welcome to Redwood! And a strange issue indeed.

@aldonline curious if you have any ideas here especially regarding how to get more information out of the VS Code output, e.g. where is "types" coming from?

[fveauvy]

Hello @thedavidprice ! Thanks for the warm welcome.

I'll try to investigate this issue myself this week, as I'd like to contribute to this awesome project :)

[thedavidprice]

Rad! We'd welcome the help. There's some good "getting started as a contributor" info in this issue.

If you're interested in helping move TS support forward, here's the Project Board with Tracking issues.

• Generators https://github.com/redwoodjs/redwood/issues/523
• https://github.com/redwoodjs/redwood/issues/1217

And PR #1312 needs to be split into smaller PRs (see this comment). It might be a great place to start to ask if you could help move one of the specific items forward.

[fveauvy]

I think I found what was causing my issue.

https://github.com/microsoft/TypeScript/issues/27956

In my case, the errors occurred because my package.json specified a package named @types/x. The notification in the Problems tab disappeared as soon as I removed the dependency from package.json.

[thedavidprice]

Ah, rodger that. Doesn't look like there's a workaround for now, correct?

[fveauvy]

I think I found two workarounds by tweaking the _tsconfig.json_ file a bit. But please keep in mind that I'm certainly not a typescript wizard and you should took it with a pinch of salt 😄

Let's say I add yup package (schema validation helper) as well as its typed package to the redwood web side :

• yarn workspace web add yup
• yarn workspace web add @types/yup -D

1. Add a types property

If I add the types property with an empty array value to _tsconfig.json_ the issue isn't displayed anymore and I keep the type definition of yup in my IDE.

{
  "compilerOptions": {
    "noEmit": true,
    "allowJs": true,
    "esModuleInterop": true,
    "target": "esnext",
    "module": "esnext",
    "moduleResolution": "node",
    "jsx": "preserve",
    "baseUrl": "./",
    "paths": {
      "src/*": ["./src/*"]
    },
    "typeRoots": ["../.redwood"],
    "types": []
  },
  "include": ["src"]
}

It's a bit odd since the types property doc mentions that only packages listed will be included in the global scope...

2. Modify the typeRoots property

Another workaround I found is to change the typeRoots property as followed :
"typeRoots": ["../.redwood", "../node_modules/@types"],

This makes more sense to me since I think that only adding ../.redwood is preventing other @types/. packages to be included.

[jvanbaarsen]

I'm still seeing this issue with Redwood 0.21. Can it be that no workaround has been pushed upstream? I only have this problem when I run yarn tsc -p ./api.

Can that have something to do with this note in the docs?

This is happening in a brand new project, only thing I've done after running the create-redwood app command is add the TSConfig files.

I'm having very few TS experience, so good chance I'm doing something stupid here.

[AntonioMeireles]

@thedavidprice,

could we keep this open until a canonical solution is found ?

FWIW the "Modify the typeRoots property" referenced above doesn't seem to work at all. OTOH adding the empty types trick does make the error go away. It's not clear to me also if this is the right way to do it (as it seems at odds with MS docs - @Krisztiaan any idea on this ?); If it is then the tsconfig.json snippets at https://redwoodjs.com/docs/typescript.html#typescript should probably be updated so that things work of the box...

While on it, why doesn't yarn create redwood-app add those tsconfig.json by default ? less friction for users, IMHO.