Recoil Nexus - Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got object
Question
I started getting the error:
error - Error: Element type is invalid: expected a string (for built-in components) or
a class/function (for composite components) but got: object.
at ReactDOMServerRenderer.render ...
when adding TypeScript support to my NextJS project.
I searched for similar questions but the answers were mostly about wrong import/export. But in my case it seems to be other than that.
I also get a warning before this error:
Warning: React.jsx: type is invalid -- expected a string (for built-in components) or
a class/function (for composite components) but got: object.
Check your code at _app.js:18.
at App (webpack-internal:///./pages/_app.js:19:16)
This is my _app.js :
import "../styles/global.scss";
import "video.js/dist/video-js.css";
import { RecoilRoot } from "recoil";
import RecoilNexus from "recoil-nexus";
import { CookiesProvider } from "react-cookie";
import Head from "next/head";
export default function App({ Component, pageProps }) {
return (
<>
<Head>
<meta name="theme-color" content="#fff" />
<meta name="viewport" content="initial-scale=1, width=device-width" />
</Head>
<CookiesProvider>
<RecoilRoot>
<RecoilNexus />
<Component {...pageProps} />
</RecoilRoot>
</CookiesProvider>
</>
);
}
So the error was being generated because of the <RecoilNexus /> part.
I tried commenting it and the error was gone. However, I still need to use it in my project.
1 answers
solution1
0 2022-08-15 13:50:48
Just changing my _app.js file's extension to _app.tsx fixed the problem. I'm still not sure why this has happened and if this problem only exists when using recoil-nexus and adding TS to the NextJS project or it's something you have to do when adding TS to an existing project. I'd be happy to know more about the reason for this
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.