Target container is not a DOM element React.js
Question
I have had a look at all the other posts that have had this issue, but I am still confused as to why I am running into this error. I made sure I used id in my
Just started playing with React, so I am sure its something quite silly.
Thanks for the help in advance.
Code is below.
index.html
<html>
<head>
</head>
<body>
<div id="testing"></div>
<script src="index.js"></script>
</body>
</html>
index.js
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';
ReactDOM.render(<App />, document.getElementById('testing'));
registerServiceWorker();
Full Error message:
invariant
../app/node_modules/fbjs/lib/invariant.js:42 renderSubtreeIntoContainer
../app/node_modules/react-dom/cjs/react-dom.development.js:15144 render
../app/node_modules/react-dom/cjs/react-dom.development.js:15254
▲ 3 stack frames were expanded.
./src/index.js
../app/src/index.js:6
3 | import './index.css';
4 | import App from './App';
5 |
> 6 | ReactDOM.render(<App />, document.getElementById('testing'));
7 |
8 |
9 |
View compiled
▼ 6 stack frames were expanded.
__webpack_require__
../app/webpack/bootstrap 4755e61baeec1360d412:678
fn
../app/webpack/bootstrap 4755e61baeec1360d412:88
0
http://localhost:3000/static/js/bundle.js:35264:18
__webpack_require__
../app/webpack/bootstrap 4755e61baeec1360d412:678
./node_modules/ansi-regex/index.js.module.exports
../app/webpack/bootstrap 4755e61baeec1360d412:724
(anonymous function)
http://localhost:3000/static/js/bundle.js:728:10
3 answers
solution1
8 ACCPTED 2017-11-12 02:09:46
Make sure to double check the index.html you are seeing in your browser. Assuming you use create-react-app an thereby webpack it might serve you a different file either from memory or from the public folder.
Mistake was found from discussion in comments and chat.
solution2
2 2017-11-12 01:49:36
你需要像这样调用React.createElement() ：
ReactDOM.render(React.createElement(<App />), document.getElementById('testing'));
solution3
0 2018-09-11 12:05:31
如果id属性与其名称相同，请检入html文件
ReactDOM.render(, document.getElementById('index'));
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.