(React Typescript) 'Component' refers to a value, but is being used as a type here. Did you mean 'typeof Component'?

I want to make routes array and apply it on useRoutes from react-router@6. Currently I am using typescript and vite. But, i got error when try to assign my component to ‘element’ key.

type HelloWorld = /unresolved/ any
‘HelloWorld’ refers to a value, but is being used as a type here. Did you mean ‘typeof
HelloWorld’?ts(2749)
Parsing error: ‘>’ expected.eslint

import { useRoutes, RouteObject } from "react-router-dom"

import { HelloWorld } from "@/HelloWorld"

export function Router (): ReturnType<typeof useRoutes> {
  const routes: RouteObject[] = [
    {
      path: "hello-world",
      element: <HelloWorld />
    }
  ]

  return useRoutes(routes)
}

>Solution :

Please make sure that your file has the .tsx file extension and is not just a .ts file.