Type d'élément n'est pas valide: attend une chaîne de caractères (pour les composants intégrés) ou de classe/fonction
import React from 'react';
import ReactDOM from 'react-dom';
import Map from './components/map/container/map';
import App from './App';
import './index.css';
import shell from './shared/utility/shell';
import { render } from 'react-dom'
import { Provider } from 'react-redux'
import { createStore, applyMiddleware, compose } from 'redux'
import { routerMiddleware, ConnectedRouter } from 'react-router-redux'
import thunk from 'redux-thunk'
import createHistory from 'history/createBrowserHistory'
import rootReducer from './reducers'
import registerServiceWorker from './registerServiceWorker';
import { Routes } from './config';
const history = createHistory();
const target = document.querySelector('#root')
const initialState = {};
const enhancers = [];
const middleware = [
thunk,
routerMiddleware(history)
];
if (process.env.NODE_ENV === 'development') {
const devToolsExtension = window.devToolsExtension;
if (typeof devToolsExtension === 'function') {
enhancers.push(devToolsExtension());
}
}
const composedEnhancers = compose(
applyMiddleware(...middleware),
...enhancers
);
const store = createStore(
rootReducer,
initialState,
composedEnhancers
);
render(
<Provider store={store}>
<ConnectedRouter history={history}>
<div>
<Routes />
</div>
</ConnectedRouter>
</Provider>,
target
)
registerServiceWorker();
ReactDOM.render(<App />, document.getElementById('root'));
registerServiceWorker();
Je suis en train d'appeler une API à partir avec l'aide de redux et l'affichage de ses données dans un tableau. J'obtiens cette erreur. Ci-dessus est mon index.js
fichier.
1.
Type d'élément n'est pas valide: attend une chaîne de caractères (pour les composants intégrés) ou de classe/fonction (pour les composants composites) mais: undefined. Vous avez probablement oublié d'exporter votre composant à partir du fichier est défini dans.
2.
De réagir.createElement: type est invalide -- attend une chaîne de caractères (pour les composants intégrés) ou de classe/fonction (pour les composants composites) mais: undefined. Vous avez probablement oublié d'exporter votre composant à partir du fichier est défini dans.
J'ai parlé à beaucoup de réponses, je ne suis pas en mesure de reconnaître l'erreur.
- Vous essayez de rendre quelque chose qui n'est pas de réagir composant ou d'une fonction. Probablement le problème est votre
App
ouRoutes
depuis ceux qui semblent être personnalisés vous sont rendu. Vérifiez les exportations en provenance de ces fichiers et les fichiers qu'ils importent. - comme @AustinGreco dit, c'est une importation/exportation problème. cochez cette
- Je ne sais pas vous l'avez résolu ou pas, j'ai été en cours d'exécution dans le même problème une fois, trouvé et j'ai appliqué les codes pour réagir-routeur-redux@next(5.0.0-alphaN) sur l'ancienne version de réagir-routeur-redux.
Vous devez vous connecter pour publier un commentaire.
Problème est dans les déclarations d'importation. Vous n'avez pas utilisé accolades lors de l'importation de certains composants comme
createHistory
.Si un composant utilise une valeur par défaut à l'exportation comme:
Ensuite, vous pouvez simplement importer comme:
Mais si vous utilisez un nom d'exportation comme:
Ensuite, vous devez l'importer dans des accolades comme:
Donc un coup d'oeil à vos importations. Cela permettra de résoudre votre problème.
Je suis tombé sur le même problème dans mon réagir application. C'est certainement de vos déclarations d'importation indiqués ci-dessus.
J'ai changé
import {x} from '/x.js'
pour
import x from '/x.js'
et que fait le travail
J'ai également ce message d'erreur lorsque l'un des composants imbriqués tenté de rendre un composant qui n'existe pas. Plus précisément, j'ai tenté d'utiliser
une réaction composant natif de Réagir, j'ai été en utilisant
Pour moi, j'ai été confronté à ce problème quand j'oublie d'utiliser réagir-redux est
connect
dans mon exportation.Donc,
en train de changer:
À:
résolu le problème. Vraiment stupide erreur
Il peut aussi être causé par où le point d'entrée est.
Dans mon cas, l'App.js a l'appel de index.js (où le développeur de la console a été l'identification de l'erreur, et où mon RenderDom appel a été).
Cependant, App.js faisait référence à un composant, et c'est au sein de ce composant que j'ai eu l'erreur (une référence à un autre composant qui n'existe pas).
Comme il a été dit ci-dessus, cette question de l'importation. Dans mon cas, c'était un CSSTransitionGroup d'importation. Après mnp mise à jour du paquet 'réagir la transition, le groupe" ne contient plus de CSSTransitionGroup, mais il contient des exportations, comme CSSTransition et TransitionGroup. Donc, je viens de remplacer la ligne:
avec