web-dev-qa-db-ja.com

ReactDomは未定義です

WebpackとBabelでReactを使用しています。ランタイムエラーが発生しています。

キャッチされないReferenceError：ReactDomは定義されていません

私の反応バージョンは：

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

私のコードは次のとおりです。

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

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

私は何を間違えていますか？

javascriptreactjswebpackbabeljsreact-dom
11
Yaniv Efraim

ReactDOMがありますが、ReactDom（大文字と小文字が区別されます）はありません

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

ReactDOM！=ReactDom。これを修正するためにできることは2つあります。

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.

ReactDOM！= ReactDomであるため。したがって、これらの場所のいずれかを修正して、両方の場所が同じ大文字と小文字の同じ名前になるようにする必要があります。

推奨される修正は、

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

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

またはあなたがすることができます、

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

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