javascript React - 未捕获的错误:目标容器不是 DOM 元素
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/47161515/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
React - Uncaught Error: Target container is not a DOM element
提问by Edward
I'm new to react.
我是新来的反应。
My error is:
我的错误是:
Uncaught Error: Target container is not a DOM element
未捕获的错误:目标容器不是 DOM 元素
I've Googled this plenty of times and find people who have this error:
我在谷歌上搜索了很多次,发现有这个错误的人:
Uncaught Error: Invariant Violation: _registerComponent(...): Target container is not a DOM element.
未捕获的错误:不变违规:_registerComponent(...):目标容器不是 DOM 元素。
Mine doesn't contain:
我的不包含:
_registerComponent(...):
_registerComponent(...):
Here are my files:
这是我的文件:
index.html
索引.html
<html>
<head>
<meta charset="utf-8">
<title>React</title>
</head>
<body>
<div id="root"></div>
<script src="./bundle.js"></script>
</body>
</html>
index.jsx
索引.jsx
import React from 'react';
import ReactDOM from 'react-dom';
ReactDOM.render(
<div>
<h1>Hello World!</h1>
</div>,
document.getElementById('root')
);
webpack.config.js
webpack.config.js
const path = require('path');
module.exports = {
context: path.join(__dirname, 'src'),
entry: './index.jsx',
output: {
path: path.join(__dirname, 'public'),
filename: './bundle.js'
},
module: {
loaders: [
{ test: /\.js$/, loader: 'babel-loader', exclude: /node_modules/ },
{ test: /\.jsx$/, loader: 'babel-loader', exclude: /node_modules/ },
],
},
resolve: {
modules: [
path.join(__dirname, 'node_modules')
]
}
};
The most common issue I found people were having with this error is that they put <script>in the head or before the <div>. Yet I don't do neither of these so I have no idea what the problem is.
最常见的问题,我发现人们用这个错误有是,他们把<script>在头部或之前<div>。然而我不做这些,所以我不知道问题是什么。
采纳答案by Edward
Thanks to Axnyff for his help as it resolved my question. The problem was with a dependency I was using, webpack-dev-middleware.
感谢 Axnyff 的帮助,因为它解决了我的问题。问题出在我使用的依赖项 webpack-dev-middleware 上。

