nextui icon indicating copy to clipboard operation
nextui copied to clipboard

[BUG] - Tailwind v4 beta - Composite Typescript project - The inferred type of 'default' cannot be named without a reference to ....

Open catvec opened this issue 6 months ago • 3 comments

HeroUI Version

2.8.0-beta.6

Describe the bug

I have a project with tsconfig.json composite set to true.

When following the Hero + Tailwind v4 beta instructions the following step to create hero.ts file results in a type error:

Create hero.ts file

// hero.ts
import { heroui } from "@heroui/react";
export default heroui();
src/hero.ts:2:1 - error TS2742: The inferred type of 'default' cannot be named without a reference to '../../../node_modules/tailwindcss/dist/types-B254mqw1.mjs'. This is likely not portable. A type annotation is necessary.

2 export default heroui();

I was able to fix this bug by explicitly re-defining the type from the imported heroui function:

import plugin from 'tailwindcss/plugin.js';
import { heroui } from "@heroui/react";

const h: ReturnType<typeof plugin> = heroui();

export default h;

Your Example Website or App

https://github.com/catvec/bugs/tree/873b7388df5f2b081550c05c4cb4705a36eeadcd/heroui-tailwind-v4-external-type

Steps to Reproduce the Bug or Issue

  1. In a Typescript project with compilerOptions.composite set to true
  2. Follow the HeroUI with Tailwind v4 install docs
  3. Run a Typescript type check (tsc --noEmit ...)
  4. You will get an error about the default export type of heroui() not being "portable"

Expected behavior

The type definition from heroui() should not raise errors or the instructions should include a way of specifying valid types like I show above.

Screenshots or Videos

No response

Operating System Version

Linux

Browser

Firefox

catvec avatar May 29 '25 22:05 catvec

@catvec have you tried setting declarationMap to true in your tsconfig file?

wingkwong avatar May 31 '25 11:05 wingkwong

@catvec have you tried setting declarationMap to true in your tsconfig file?

That fixes it in my minimal reproduction. However in my full project that setting was already set. I'll try and figure out how to make the minimal reproduction reproduce the error with declarationMap set to true. I suspect it is something to do with my full project being a monorepo with nx setting up typescript workspaces.

catvec avatar Jun 01 '25 22:06 catvec

I needed to install @heroui/react-utils explicitly in the library, that exports my heroui components. This is in a monorepo.

mzronek avatar Jun 16 '25 14:06 mzronek