allen•2y ago

any types

I seem to have broken my api typings today. I'm not quite sure what did it exactly. I was just refactoring my function file structure, and suddenly all of my useQuery, useMutation, etc react helpers now return types of any. I've tried rerunning codegen, upgrading the convex cli, deleting all node_modules and re-installing -- even reverting my refactoring changes. Nothing seems to get back to having end-to-end type safety. I get the same behavior in webstorm and vscode. Unsure of how to get back to a happy place. Any tips?

24 Replies

ian•2y ago

I've had this happen to me, and often I can debug in a couple places: 1. If npx convex dev isn't running, run that or npx convex codegen to make sure any new files are in convex/_generated/api.d.ts 2. If a file name has a character like - in it, then convex/_generated/api.d.ts might be failing. Open that file and see what types it's generating. 3. If your convex/tsconfig.json has "allowJs": true, but your root tsconfig.json doesn't, and you have js files in convex/, then it'll build the server files successfully but not link them to the rest of the codebase well. 4. Restart the TS server. in VSCode, do it by doing cmd+shift+p and searching for "Restart TS server". Sometimes it gets unhappy when files change underneath it. 5. If you're using my withZod wrapper, I recently realized that if you don't specify a return zod type (as an argument after the function) then it'll be typed as any 6. An unsaved file that is visible to the editor's TS server but not actually saved to disk - npx convex codegen should catch this though Update: 7. Using baseUrl / paths in convex/tsconfig.json

sshader•2y ago

Another debugging idea -- run npx tsc -p . from the root of your project. Sometimes there are type errors that are surfaced here that don't show up in the editor.

allenOP•2y ago

No dice. - api.d.ts appears to be generating fine. - Tried adding "allowJs": true to other tsconfig.json without effect. - Tried restarting typescript server and switching the typescript bin version to no avail. - Not using withZod - npx tsc -p . returns no errors. ok so it appears to be my file structure. if i create convex/causes/queries/causes.ts with export default query(...) things seem to generate properly, but the useQuery return type is lost.

ian•2y ago

If you check out an older version of code is it working again? It'd be nice to know if it's a code change or an environment change

allenOP•2y ago

I was trying to better organize my files in [domain]/[queries|mutations]/[function-name].ts

ian•2y ago

Do you mean if you use a non-default export like export const causeFunc = query(...) then you don't get types for causes/queries/causes:causeFunc?

allenOP•2y ago

I havent tried named exports let me see

ian•2y ago

and does the "causes/queries/causes" string auto-complete?

allenOP•2y ago

yes the function name autocompletes fine seems like anything in a nested dir structure, whether default exports or named exports, results in broken return types for useQuery wait, actually i think it may be something else

sshader•2y ago

Also I realized I wasn't very clear -- does npx tsc -p . run from wherever your React code is located produce anything interesting? (presumably outside of your convex directory)

allenOP•2y ago

i also introduced paths to convex/tsconfig.json. It seems when the query uses those paths to import deps it breaks the api types yup, nested structure doesnt seem to be the issues, its the ts paths config import { query } from '@gen/server'; blows it up when trying to use:

    "baseUrl": ".",
    "paths": {
      "@gen/*": ["_generated/*"]
    }

    "baseUrl": ".",
    "paths": {
      "@gen/*": ["_generated/*"]
    }

i guess ill just remove that, but the directory crawling is getting a bit ugly

ian•2y ago

I wonder if you need to add the same paths entry to your root level tsconfig. bear in mind I mostly guess when it comes to tsconfig : @sshader knows what she's doing more there

allenOP•2y ago

I'm also in a monorepo with convex as a separate app dir than my client app.

ian•2y ago

The reason being that your client code imports types from your server code, and might not be leveraging the tsconfig in the convex directory when doing those imports.

sshader•2y ago

I have a theory that "baseUrl": "." might be causing TypeScript to confuse convex/schema.ts with the convex/schema import from the npm package. I'm curious what happens without the "baseUrl": "." (I think it's not necessary for using paths but not 100% sure)

allenOP•2y ago

yeah, that makes sense. be great if the type generation was flattened out a bit more so it didnt have so many deps.

ian•2y ago

As an aside, I'd love to document how your monorepo setup works, since I've never set that up myself. Another time though, I'm off to dinner

allenOP•2y ago

I'll see if I can find some time to throw together a minimal reproduction of what I have. have a good night!

sshader•2y ago

https://discord.com/channels/1019350475847499849/1078449429662666853/1079893845698937026 is the similar issue with baseUrl, so very curious if removing the baseUrl makes TypeScript happier (the other option is renaming your convex directory to something other than convex)

allenOP•2y ago

https://github.com/allenhartwig/convex-turborepo

GitHub

GitHub - allenhartwig/convex-turborepo

Contribute to allenhartwig/convex-turborepo development by creating an account on GitHub.

allenOP•2y ago

@ian ^ @sshader unfortunately that didnt solve for my setup

Gorka Cesium•2y ago

ah nice, this is very helpful @allen my repo setup is similar but instead of turborepo I just use pnpm workspaces. Since I work by myself I don't see the gain of turborepo caching

allenOP•2y ago

should work similarly, as turbo can optionally us pnpm under the hood i personally use the yarn workspaces flavor, so there may be some variance

Gorka Cesium•2y ago

yeah looks almost identical Why did you put convex in apps dir instead of packages?

any types

Did you find this page helpful?