Javascript Web包-呈现多个组件时出现问题

我有两个独立的组件。第一个是App in

App.js

import React, { Component } from 'react';
import ReactDOM from "react-dom";
import {connect, Provider} from "react-redux";
import {redux_Store} from "./redux_Store";
import autobind from "class-autobind";

class App extends React.Component {
 render() {return (<div>a</div>)}
}
ReactDOM.render(
 <Provider store={redux_Store}>
   <App/>
 </Provider>
 , document.querySelector('#app'));

import React, { Component } from 'react';
import ReactDOM from "react-dom";
import {connect, Provider} from "react-redux";
import {redux_Store} from "./redux_Store";
import autobind from "class-autobind";

class Prod extends React.Component {
   render() {return (<div>a</div>)}
}
ReactDOM.render(
 <Provider store={redux_Store}>
   <Prod/>
 </Provider>
 , document.querySelector('#prod'));

import {App} from "./App";
import {Prod} from "./Prod";

这些组件中的每一个都应该呈现在不同的页面上。我创建了另一个文件作为Webpack的入口文件。它是

All.js

import React, { Component } from 'react';
import ReactDOM from "react-dom";
import {connect, Provider} from "react-redux";
import {redux_Store} from "./redux_Store";
import autobind from "class-autobind";

class App extends React.Component {
 render() {return (<div>a</div>)}
}
ReactDOM.render(
 <Provider store={redux_Store}>
   <App/>
 </Provider>
 , document.querySelector('#app'));

import React, { Component } from 'react';
import ReactDOM from "react-dom";
import {connect, Provider} from "react-redux";
import {redux_Store} from "./redux_Store";
import autobind from "class-autobind";

class Prod extends React.Component {
   render() {return (<div>a</div>)}
}
ReactDOM.render(
 <Provider store={redux_Store}>
   <Prod/>
 </Provider>
 , document.querySelector('#prod'));

import {App} from "./App";
import {Prod} from "./Prod";

但是，当我加载呈现应用程序的页面时，我看到错误

Uncaught错误：目标容器不是DOM元素，但应用程序仍然呈现。但在呈现Prod的页面上，我看到了相同的错误，但没有输出（Prod未呈现）

有趣的是，如果我省略了
All.js
中的两行中的任何一行，那么错误就会消失，而另一行内容也不会出现问题。有人知道我做错了什么吗？
App
和
Prod
可以在不将它们包装在单个父组件中的情况下进行渲染

render() {
  return [
    <App />
    <Prod />
  ];
}

render（）{
返回[
];
}
你是说我把它放在
All.js
中了吗？是的，
App.js
和
Prod.js
可以作为单独的组件使用。对不起，我不太明白你的意思。在视图中包装这两个组件之后，我应该如何处理视图？我渲染它吗？App和Prod不应该一起渲染。是的…将它们渲染为
render（）{return（…）}
它不工作，我仍然有相同的错误。我真的看不出构建
视图的意义，反正我从来没有使用过它