refinedev/refine

[BUG] Upgrading from 4.48.0 to 4.49.0 break TypeScript imports in `@refinedev/core`

sharky98 opened this issue · 4 comments

Describe the bug

After an upgrade to 4.49.0, TypeScript is not able to figure out the imports: Module '"@refinedev/core"' has no exported member 'useTranslate'.ts(2305).

So far, in my codebase, the following elements are not being processed by TypeScript:

  • Authenticated
  • useLogin
  • useTranslate
  • useIsAuthenticated
  • useLogout
  • useGetLocale
  • useSetLocale
  • useTranslate
  • Refine

The following elements seems to be imported correctly by TypeScript:

  • AuthProvider
  • RefineProps
  • I18nProvider
  • ResourceProps

Steps To Reproduce

I'll have to detail it more later on if needed. I am using a Nx workspace.

  1. Create a file that uses import { Authenticated, useLogin, useTranslate } from "@refinedev/core";

Expected behavior

Imports work as they did in 4.48.0.

Packages

  • @refinedev/core: 4.49.0

Additional Context

I suspect #5755 is the pull that introduced that behavior.

When running vite to serve, everything works fine. So I guess my serve by-pass typechecking in some way 🤷🏼.

This is what my tsconfig.json looks like (at least, when at the Nx tsconfig are merged).

{
  "compilerOptions": {
    "jsx": "react-jsx",
    "allowJs": false,
    "esModuleInterop": false,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "composite": false,
    "sourceMap": true,
    "declaration": true,
    "composite": true,
    "moduleResolution": "Node16",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "importHelpers": true,
    "verbatimModuleSyntax": true,
    "target": "ES2022",
    "module": "Node16",
    "lib": ["ES2023", "DOM"],
    "skipLibCheck": true,
    "skipDefaultLibCheck": true,
  }
}

Hey @sharky98 sorry for the issue! I will try to investigate it quickly and get back to you. Is there any chance for you to change moduleResolution from Node16 to NodeNext or Bundler (depending on your Vite version)? Did you upgrade all Refine packages? Do other Refine packages work just fine after the upgrades?

I am off work for now, will try as soon as I have the chance tomorrow or Monday for the module resolution.

I am using only the router package without issue (but it is importing without curly brackets).

So, changing my tsconfig.json to use

"moduleResolution": "Bundler",
"module": "Preserve",

Seems to resolve the situation about TS errors, without breaking anything in my codebase. I'll go with that for the moment, but I will leave this open for you to figure out how to support Node16.

NodeNext was still giving the errors.

Hey @sharky98, it's good that it's resolved with changing moduleResolution, I've done a small investigation on this and found that the wildcard re-exports are the ones causing problems. I'll continue my investigation but currently I'm suspecting that the change in the .d.ts file extensions caused this issue. I think the imports are using wrong extensions for .d.ts files like index.d.mts is trying to import from components/index.d.ts and fail to resolve.

An obvious workaround may be replacing wildcard re-exports but I think they will still cause issues like types being any due to unresolvable type imports 🤔

I'll update here once I have anything more to add. 🙏