user

Joseph Morgan

31 Jan 2022

[solved] Error: Element type is invalid: expected a string (for built-in components)

React js

Hello Everyone,
I am facing this error in my Reactjs App when I try to install react-snap updated the index.js this error came suddenly 

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

The used code in index.js is 

import 'react-app-polyfill/ie11';
import 'react-app-polyfill/stable';
import 'react-perfect-scrollbar/dist/css/styles.css';
import 'react-draft-wysiwyg/dist/react-draft-wysiwyg.css';
import 'react-quill/dist/quill.snow.css';
import 'prismjs/prism';
import 'prismjs/components/prism-bash';
import 'prismjs/components/prism-javascript';
import 'prismjs/components/prism-jsx';
import 'nprogress/nprogress.css';
import 'src/__mocks__';
import 'src/assets/css/prism.css';
import 'src/mixins/chartjs';
import React from 'react';
import { hydrate, render } from "react-dom";
// import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { enableES5 } from 'immer';
import * as serviceWorker from 'src/serviceWorker';
import store from 'src/store';
import { SettingsProvider } from 'src/contexts/SettingsContext';
import App from 'src/App';

enableES5();

const APP = ( 
<Provider store={store}>
 <SettingsProvider>
 <App />
 </SettingsProvider>
</Provider>
);

const rootElement = document.getElementById("root");
if (rootElement.hasChildNodes()) {
 hydrate(<APP />, rootElement);
} else {
 render(<APP />, rootElement);
}

serviceWorker.register();

What should I do? 

Comments

Mohamed Atef

31 Jan 2022

Best Answer

best answer
githubgithubgithub

Hello,
There is a problem in using the const which called APP, you used it like component and exported from somewhere but the truth is it's regular constant so you just need to call it's name using APP not <APP />

const rootElement = document.getElementById("root");
if (rootElement.hasChildNodes()) {
 hydrate(APP, rootElement);
} else {
 render(APP, rootElement);
}

Good luck

Replies

Joseph Morgan

31 Jan 2022

Thank you so much :)
it's beginners mistakes

© 2024 Copyrights reserved for web-brackets.com