web-dev-qa-db-fra.com

ReactDom n'est pas défini

J'utilise React avec Webpack et Babel. Je reçois une erreur d'exécution:

Uncaught ReferenceError: ReactDom n'est pas défini

Ma version de réaction est:

"devDependencies": {
   "phantomjs-polyfill": "0.0.2",
   "react-addons-test-utils": "^0.14.8"
 },    
 "dependencies": {
   "react": "^0.14.7",
   "react-dom": "^0.14.7"
 },

et mon code est:

import React from 'react';
import ReactDOM from 'react-dom';
import Main from './components/main';

ReactDom.render(<Main />, document.getElementById('root'));

Qu'est-ce que je fais mal?

8
Yaniv Efraim

Vous avez ReactDOM mais vous n'avez pas ReactDom (sensible à la casse)

ReactDOM.render(<Main />, document.getElementById('root'));
28
Alexander T.

ReactDOM! = ReactDom. Il y a deux choses que vous pouvez faire pour résoudre ce problème.

import React from 'react';
import ReactDOM from 'react-dom'; // you used 'react-dom' as 'ReactDOM'
import Main from './components/main';

ReactDom.render(<Main />, document.getElementById('root')); // you referred to it as 'ReactDom' which is wrong.

Parce que ReactDOM! = ReactDom. Vous devez donc réparer l’un de ces endroits afin que les deux endroits portent le même nom et le même cas.

Le correctif recommandé serait,

import React from 'react';
import ReactDOM from 'react-dom'; // this is recommended 
import Main from './components/main';

ReactDOM.render(<Main />, document.getElementById('root'));

Ou tu peux faire,

import React from 'react';
import ReactDom from 'react-dom';
import Main from './components/main';

ReactDom.render(<Main />, document.getElementById('root'));
0
prime