'FormattedMessage' cannot be used as a JSX component.

[santib88]

When trying to update React 18 => 19

I get this typescript error message

Full message:

'FormattedMessage' cannot be used as a JSX component.
  Its type 'ComponentType<Props<Record<string, string | number | boolean | ReactElement<any, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ... 4 more ... | undefined>>>' is not a valid JSX element type.
    Type 'ComponentClass<Props<Record<string, string | number | boolean | ReactElement<any, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ... 4 more ... | undefined>>, any>' is not assignable to type 'ElementType'.
      Type 'ComponentClass<Props<Record<string, string | number | boolean | ReactElement<any, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ... 4 more ... | undefined>>, any>' is not assignable to type 'new (props: any) => Component<any, any, any>'.
        Construct signature return types 'Component<Props<Record<string, string | number | boolean | ReactElement<any, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ... 4 more ... | undefined>>, any, any>' and 'Component<any, any, any>' are incompatible.
          The types returned by 'render()' are incompatible between these types.
            Type 'import("/Users/santiago.italo/Documents/Repositories/client-area/node_modules/react-intl/node_modules/@types/react/index").ReactNode' is not assignable to type 'React.ReactNode'.
              Type 'ReactElement<any, string | JSXElementConstructor<any>>' is not assignable to type 'ReactNode'.
                Property 'children' is missing in type 'ReactElement<any, string | JSXElementConstructor<any>>' but required in type 'ReactPortal'.ts(2786)

[amannn]

Hey, based on the stack trace you're using react-intl and not next-intl, right?

[santib88]

yes, react-intl 7.1.1, that's right