不变违规：_registerComponent（…）：目标容器不是DOM元素
在制作平凡的React示例页面后，出现此错误：
未捕获的错误：始终违反：_registerComponent（...）：目标容器不是DOM元素。
这是我的代码：
/** @jsx React.DOM */
'use strict';
var React = require('react');
var App = React.createClass({
render() {
return <h1>Yo</h1>;
}
});
React.renderComponent(<App />, document.body);
HTML：
<html>
<head>
<script src="/bundle.js"></script>
</head>
<body>
</body>
</html>
这是什么意思？
第392篇《不变违规：_registerComponent（…）：目标容器不是DOM元素》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点
对于使用ReactJS.Net并在发布后出现此错误的用户：
检查.jsx文件的属性，并确保Build Action将其设置为Content。设置为的那些None将不会被发布。我从这个SO答案中得到了这个解决方案。
以我为例，此错误是由热重载引起的，同时引入了新类。在项目的那个阶段，请使用普通的观察者来编译您的代码。
该准备功能，可以使用这样的：
$(document).ready(function () {
React.render(<App />, document.body);
});
如果您不想使用jQuery，可以使用以下onload函数：
<body onload="initReact()">...</body>
只是一个疯狂的猜测，如何向index.html添加以下内容：
type="javascript"
像这样：
<script type="javascript" src="public/bundle.js"> </script>
对我来说，它奏效了！:-)
是的，基本上您所做的是正确的，除了您忘记了JavaScript在许多情况下是同步的，因此在加载DOM之前运行代码，有几种方法可以解决此问题：
1）检查DOM是否已完全加载，然后执行所需的任何操作，例如，您可以收听DOMContentLoaded：
<script>
document.addEventListener("DOMContentLoaded", function(event) {
console.log("DOM fully loaded and parsed");
});
</script>
2）非常常见的方法是将script标签添加到您的底部document（在body标签之后）：
<html>
<head>
</head>
<body>
</body>
<script src="/bundle.js"></script>
</html>
3）使用window.onload，当整个页面加载时会被触发（img等）
window.addEventListener("load", function() {
console.log("Everything is loaded");
});
4）使用document.onload，当DOM准备就绪时会触发：
document.addEventListener("load", function() {
console.log("DOM is ready");
});
还有更多选项可以检查DOM是否准备就绪，但是简单的答案是在确保在每种情况下DOM准备就绪之前都不要运行任何脚本...
JavaScript正在与DOM元素一起使用，如果它们不可用，则将返回null，可能会破坏整个应用程序...因此，请始终确保在运行JavaScript之前已准备就绪...
相似问题
问题类别
我遇到类似/相同的错误消息。就我而言，我没有用于定义ReactJS组件的目标DOM节点。确保使用适当的“ id”或“ name”以及其他HTML属性（适合您的设计需求）很好地定义了HTML目标节点。