Reactjs 如何使用webpack HotModuleReplacementPlugin构建两个html网站

我使用webpack HotModuleReplacementPlugin让我的网站在修复代码时可以热加载

但我不知道如何构建两个html页面

我想构建两页的“index.html”和“introduction.html”

现在我在webpack.config.js中使用这些代码，但在Chrome开发工具中会显示出一个问题

「未捕获错误：_registerComponent（…）：目标容器不是DOM元素。」

我怎样才能解决这些问题

var webpack=require（'webpack'）；
var path=require（'path'）；
var htmlWebpackPlugin=require（'html-webpack-plugin'）；
var autoprefixer=require（'autoprefixer'）；
变量配置={
条目：{
索引：[
'网页包开发服务器/客户端？http://0.0.0.0:8080',
“webpack/hot/only dev server”，
resolve（uu dirname，'src/index.jsx'）
],
导言：[
'网页包开发服务器/客户端？http://0.0.0.0:8080',
“webpack/hot/only dev server”，
resolve（uu dirname，'src/introduction.jsx'）
],
},
输出：{
path:path.resolve（uu dirname，'build'），
publishPath:“/”，
文件名：“js/[name].js”
},
模块：{
装载机：[
{
测试：/\.jsx？$/,，
排除：/node_模块/，
加载器：“反应热烈！巴贝尔”
},
{
测试：/\.sass$/,，
execlude:/node_modules/，
加载器：'style！css！postss！sass'
},{
测试：/\.scss$/,，
execulde:/node_modules/，
加载器：'style！css！postss！sass'
},
{
测试：/\.css$/,，
排除：/node_模块/，
加载器：“style！css！postss”，
},
{
测试：/\（jpg | png | gif）$/，
排除：/node_模块/，
加载器：'file？name=images/[name].[ext]'
},
{
测试：/\（woff | woff2）（\？v=\d+\.\d+\.\d+）$/，
加载器：“url？limit=10000&mimetype=application/font-woff”
},
{
测试：/\.ttf（\？v=\d+\.\d+\.\d+）？$/，
加载器：“url？limit=10000&mimetype=application/octet-stream”
},
{
测试：/\.eot（\？v=\d+\.\d+\.\d+？$/,，
加载器：“文件”
},
{
测试：/\.svg（\？v=\d+\.\d+\.\d+）？$/，
加载器：“url？limit=10000&mimetype=image/svg+xml”
}
]
},
邮政编码：[
autoprefixer（{浏览器：['last 2 versions']}）
],
决心：{
扩展名：[''，'.js'，'.jsx']
},
排除：[
/（测试）/
],
开发服务器：{
contenBase:“./dist”
},
插件：[
新建webpack.HotModuleReplacementPlugin（），
新htmlWebpackPlugin({
文件名：“index.html”，
模板：'./src/html/index.html'
}),
新htmlWebpackPlugin({
文件名：'introduction.html'，
模板：'./src/html/introduction.html'
}),
]
}
module.exports=config