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

Question

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)
}

What is HelloWorld in this context? minimal reproducible example — Drew Reese
– Drew Reese, Commented Jun 30, 2022 at 18:30

phry · Accepted Answer · 2022-06-30 18:32:16Z

20

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

answered Jun 30, 2022 at 18:32

phry

44.9k7 gold badges96 silver badges111 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

aksal Over a year ago

You're right. I missed it. Thank you.

Wahab Shah Over a year ago

Beautiful! I was thinking that my whole day will be spent on this debugging but resolved by just this thing.

wortwart Apr 28 at 17:10

In my case I needed to restart VS Code even though it was a TSX file from the beginning ...

Collectives™ on Stack Overflow

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

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related