Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.

My project has products so I have a subfolder in pages for example:

/pages/produkte/myproduct.js

I am using an HOC - Produkte.js. This is the root component of every product and I am passing values via props to render it.

• Trying to set <NextSeo/> to myproduct.js changes will not apply and the title is left default.

• Trying to set <NextSeo/> in Produkte.jsand passing props from myproduct.js will throw an error.

Invariant Violation: Element type is invalid: 
expected a string (for built-in components) or a class/function 
(for composite components) but got: undefined. 
You likely forgot to export your component from the file it's defined in, 
or you might have mixed up default and named imports.

myproduct.js

  render() {
    return (
      <Produkt
        images={ImgArray}
        headline={"TestProduct TestProduct"}
        subHeadline={"TestProduct TestProduct | TestProduct"}
        bulletPoints={BulletPoints}
        reviews={Reviews}
        price={"11,90"}
        sales={"4623"}
      >
        <NextSeo config={SeoConfig} />
        <ProductJsonLd
          productName="TestProduct"
          description={"TestProduct - TestProduct | TestProduct"}
          brand="TestProduct"
          aggregateRating={{
            ratingValue: "4.7",
            reviewCount: "215"
          }}
        />
      </Produkt>
    );
  }

EDIT: Removed <ProductJsonLd/> and can verify that the error is coming from <NextSeo/>

[n1xn]

@garmeeh & @lenchik-ponchik your solutions are working.

Please consider to update the readme file. The problem was

1. import NextSeo, { ProductJsonLd } from "next-seo";
2. <NextSeo /> must be the very first entry in a Child Component

[garmeeh]

Could you try this:

render() {
  return (
    <>
      <NextSeo config={SeoConfig} />
      <ProductJsonLd
        productName="TestProduct"
        description={"TestProduct - TestProduct | TestProduct"}
        brand="TestProduct"
        aggregateRating={{
          ratingValue: "4.7",
          reviewCount: "215"
        }}
      />
      <Produkt
        images={ImgArray}
        headline={"TestProduct TestProduct"}
        subHeadline={"TestProduct TestProduct | TestProduct"}
        bulletPoints={BulletPoints}
        reviews={Reviews}
        price={"11,90"}
        sales={"4623"}
      />
    </> 
  );
}