Next.js Discord

Discord Forum

"Link" cannot be used as a JSX component

Unanswered
Sun bear posted this in #help-forum
Open in Discord
Sun bearOP
I started a new nextjs project a few weeks ago (15.5.0) using turbopack. Today I went to use the Link component but I am getting the following typescript error:

Link' cannot be used as a JSX component.
  Its type '<RouteType>(props: LinkProps<RouteType>) => Element' is not a valid JSX element type.
    Type '<RouteType>(props: LinkProps<RouteType>) => Element' is not assignable to type '(props: any) => ReactNode | Promise<ReactNode>'.
      Type 'Element' is not assignable to type 'ReactNode | Promise<ReactNode>'.
        Property 'children' is missing in type 'ReactElement<any, any>' but required in type 'ReactPortal'.ts(2786)


I have searched around in the git issues, but all I could find was an issue related to deno which was solved by ensuring that "moduleResolution": "bundler" was set in the tsconfig.json.

I dont seem to be getting the type error for any of my own components, but any built-in nextjs component (link, form, etc) seems to throw the error.

Is there something that I have overlooked?

2 Replies

Giant panda
The most likely fix for this is to adjust the tsconfig json file. Next.js 15 and newer versions use a different approach for handling React and JSX. The key is to ensuree that the compiler knows it is working in a client component environment.
Add or update the following line in your tsconfig.json

{
"compilerOptions": {
"jsx": "react-jsx"
}
}

Hope this helps
Sun bearOP
Ah, I appreciate your suggestion regarding updating the compilerOptions.jsx. I did give it a go, but unfortunately, nextjs automatically changes it back to "preserve" with the following message:
We detected TypeScript in your project and reconfigured your tsconfig.json file for you.
The following mandatory changes were made to your tsconfig.json:

- jsx was set to preserve (next.js implements its own optimized jsx transform)

I know that I am only a few sub versions behind (15.5.0), but I might see if upgrading will fix the issue