typescript importing component error
Answered
Barbary Lion posted this in #help-forum
Barbary LionOP
i have folder in app directory : components/navbar.tsx , that exports navbar function by default , when i import it in the layout.tsx it shows this error :
Property 'navbar' does not exist on type 'JSX.IntrinsicElements'.ts(2339)
() => JSX.ElementAnswered by @ts-ignore
the name of a react component must start with uppercase letter
19 Replies
@Barbary Lion i have folder in app directory : components/navbar.tsx , that exports navbar function by default , when i import it in the layout.tsx it shows this error : Property 'navbar' does not exist on type 'JSX.IntrinsicElements'.ts(2339)
() => JSX.Element
the name of a react component must start with uppercase letter
Answer
@@ts-ignore the name of a react component must start with uppercase letter
Barbary LionOP
what if there is already the same of other node js packages ?
@Barbary Lion what if there is already the same of other node js packages ?
then import it from the package you need
import {Navbar} from "@/package1"
import {Navbar as SecondPackageNavbar} from "@/package2"Barbary LionOP
this is not solution to myproblem mate i already have component i will try renaming it to something else
@Barbary Lion this is not solution to myproblem mate i already have component i will try renaming it to something else
instead of
navbar rename it to Navbarand then fix the import
Barbary LionOP
yeah thank you i renamed it to Navbarx
i thought it was typescript error as im new to ts in general and more on next js part
Barbary LionOP
@joulev other question
this component is from flowbite-reaction
<Navbar.Brand href="localhost:3000">
does this support link component of next js ?
different question then please open a new post
Barbary LionOP
alright
also i dont use flowbite-reaction so idk about this, sorry for that
you probably need other people who have used this library to help
Barbary LionOP
i will just read their docs i guess more approperly