2017-11-07 27 views
1

私は反応が新しくなりました。React - 未知のエラー:ターゲットコンテナはDOM要素ではありません

私のエラーは、次のとおりです。

Uncaught Error: Invariant Violation: _registerComponent(...): Target container is not a DOM element.

鉱山が含まれていません:

_registerComponent(...):

Uncaught Error: Target container is not a DOM element

私は時代のこのたくさんGoogleで検索して、このエラーを持っている人を見つけました

私のファイルは以下の通りです:

index.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

import React from 'react'; 
import ReactDOM from 'react-dom'; 

ReactDOM.render(
    <div> 
     <h1>Hello World!</h1> 
    </div>, 
    document.getElementById('root') 
); 

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') 
     ] 
    } 
}; 

私は人々がこれを持った見られる最も一般的な問題エラーは彼らが頭の中に<script>を入れたことですまたは<div>の前にしかし、私はこれらのどちらもしないので、私は問題が何であるか分かりません。

+0

bodyタグの内側に入れるのではなく、このようなhtmlタグを閉じる前にボディの外側に置くことができますか?。ロード後にDOMがレンダリングされるためすべての要素。 –

+0

@HemaNandagopalそれはまだ同じエラーをスローします。私は私の.babelrc @Axnyff .babelrc – Edward

+0

があります: '{ "プリセット":[ "es2015"、 は "反応する"] }'これは正しいですか? – Axnyff

答えて

1

私の質問を解決したので、彼の助けを借りてAxnyffに感謝します。問題は、私が使用していたwebpack-dev-middlewareの依存関係でした。