[React Error]: Target container is not a DOM element

webpack在后端对React组件进行渲染的时候，浏览器控制台报错：

compose.js:822 Uncaught Invariant Violation: _registerComponent(...): Target container is not a DOM element.

我很奇怪，webpack可以正常将我的React组件使用babel转换，我的组件代码如下：

import React from 'react'
import ReactDOM from 'react-dom'
import './compose.less'class App extends React.Component {render() {return (<p className="compose-font">Little Bitch</p>)}
}
ReactDOM.render(<App />, document.getElementById('test-react-1'));

webpack.config.js

module.exports = {entry: './public/components/module_compose/compose.js',output: {path: path.resolve(__dirname, "./public/static_published/v1/js/"),filename: 'compose.js'},module: {loaders: [{test: /\.jsx?$/, loader: 'babel', exclude: /node_modules/},{test: /\.less$/, loader: 'style-loader!css-loader!less-loader'}]}

出现此错误的原因是我将webpack生成的js文件放在了head，此时DOM还没有建立完毕，因此出现 not a DOM element 的错误，所以将js文件放在HTML底部就可以了。

[React Error]: Target container is not a DOM element相关推荐

[react] Target container is not a DOM element
error 控制台报错:Target container is not a DOM element reason js没找到dom节点, 原因是script引入的js代码在head里,先执行scrip ...
React高级话题之Refs and the DOM
前言本文为意译,翻译过程中掺杂本人的理解,如有误导,请放弃继续阅读. 原文地址:Refs and the DOM 正文 Refs提供了一种访问在render方法里面创建的React element或 ...
[react] react怎么拿到组件对应的DOM元素？
[react] react怎么拿到组件对应的DOM元素? 在Class组件中 import React from 'react'; class CComponent extends React.Com ...
[react] 组件卸载前，加在DOM元素的监听事件和定时器要不要手动清除？为什么？
[react] 组件卸载前,加在DOM元素的监听事件和定时器要不要手动清除?为什么? 定时器要在 componentWillUnmount 手动清除,直接绑定在JSX里的事件监听器不用,使用ref绑定 ...
element 解决 Error: target is not existed: .page-component__scroll .el-scrollbar__wrap
element 解决 Error: target is not existed: .page-component__scroll .el-scrollbar__wrap 初次使用element的Bac ...
vue.esm.js?efeb:628 [Vue warn]: Error in mounted hook: “Error: target is not existed: .page-componen
vue.esm.js?efeb:628 [Vue warn]: Error in mounted hook: "Error: target is not existed: .page-com ...
error starting container: API error (404): network fabric_test not found“
1.所使用的fabric版本是v2.2.4,测试test-network网络 2.问题描述在调用basic链码的时候发现报错信息如下: Error: endorsement failure duri ...
warning: React does not recognize the xxx prop on a DOM element
1.错误提示 Warning: React does not recognize the `disableValue` prop on a DOM element. If you intentiona ...
Minified React error #185；
Error: Minified React error #185; visit https://reactjs.org/docs/error-decoder.html?invariant=185 fo ...

[React Error]: Target container is not a DOM element

[React Error]: Target container is not a DOM element相关推荐

最新文章

热门文章