问题及背景：

在使用react框架练习模块热更新的过程中，大家有没有遇到了react组件热更新无效的问题？
即修改组件内容后只能看到console中HMR信息，却看不到界面更新。

DellLee老师说，

“主流的loader已经帮我们做了module.hot.accept()的事情，所以webpack的HRM会实时显示。

然而看起来并不是这样。

相关配置：

webpack的相关配置：

// module.rules的配置
{
	test: /.js?$/i,
	exclude: /node_modules/,
	use: ["babel-loader"]  	// 相关配置
},
// ...
// plugins的配置
[
    new HtmlWebpackPlugin({
      template: "./src/template/index.html",
      title: "my App",
      filename: "index.html",
      showErrors: true
    }),
    new CleanWebpackPlugin(["dist"]),
    new webpack.NamedModulesPlugin(),
    new webpack.HotModuleReplacementPlugin() 	// 相关配置
  ],

babel.config.js的相关配置：

module.exports = function (api) {
  // Cache the returned value forever and don't call this function again.
  api.cache(true);
  const presets = [
    "@babel/react", // 相关配置
    "@babel/preset-env"
  ];
  const plugins = [
    // 略
  ];

  return {
    presets,
    plugins
  };
};

在网上找到一个方法，即在应用的入口处加上这段代码，界面热更新生效了！！

// 应用的入口处，随意地方书写这段代码
ReactDom.render(<App />, document.getElementById("app"));

// 代码从这里开始
if (module.hot) {
  module.hot.accept(() => {
	  // 一行代码都没有...
  });
}
// 代码从这里结束

请教老师和同学：

1，为啥最后这段代码什么逻辑也没写，却实现了模块热更新？
2，babel-loader底层未帮我们写module.hot.accept() ？