Webstorm ругается на отсутствие свойства «children» хотя оно есть, что делать?

Question

[NosferatuZodd]

const MainLayout: React.FC = ({children}) => {
    return (
        <>
           <Navbar />
            {children}
        </>
    )
}

Вебшторм пишет "TS2339: Property 'children' does not exist on type '{}'." Но при компиляции проекта(сам проект на next js) ошибок никаких не выдает. Может изменить что то в tsconfig?

Comments

[Rerurk]

Ну он же говорил нет такого поля в props

[NosferatuZodd]

Rerurk, да в том то и дело что есть, и я спокойно могу его использовать в коде, все прекрасно работает но вебшторм все равно ругается

Answer 1

[Alexandroppolus]

У тебя, наверно, Реакт 18
Там из React.FC выкинули на мороз поле children, теперь нет.

Надо добавлять вручную.

у себя на проекте запилил такой тип:

import type {FC, PropsWithChildren} from 'react';

export type ReactFC<Props extends Record<PropertyKey, unknown> = {}> = FC<PropsWithChildren<Props>>;

он добавляет children в пропсы, то есть работает как старый добрый React.FC

Comments

[NosferatuZodd]

Нашел решение еще лучше, Props тоже устарел, я использовал ScriptProps(из next'a) и все заработало

import {ScriptProps} from "next/script"

const MainLayout: React.FC<ScriptProps> = ({children}) => {
    return (
        <>
           <Navbar />
            <Container style={{margin: "100px 12%"}}>
                {children}
            </Container>
        </>
    )
}