我正在学习 React，我正在使用 create-react-app 运行它，它允许我编辑名为 App.js 的文件中的文本，并且当我在该文件中保存任何更改时，地址为 @987654321 的网页浏览器中的 @ 会自动更新而无需重新加载。通常，在制作 html/plain js 文件时，我需要重新加载页面。那么它是如何动态更新自身的呢？
【问题讨论】：
127.0.0.1 也称为 local loopback。通常，此 IP 在主机文件中具有到 localhost 的映射。现在，当您运行服务器时，您指定了它应该监听的端口，因此您的 url 是 http://localhost:3000
标签： javascript reactjs networking
有一个热重载的概念。热重载背后的想法是保持应用程序运行并注入您在运行时编辑的文件的新版本。它利用 HMR 并且无需重新加载页面，就地替换更改的组件，保留状态。这意味着，您的更改将在大约半秒内可见；如果它是一个对话框，你就不需要重新打开它，你的文本输入仍然是填充的，等等。简而言之，这对迭代开发来说是一个巨大的福音，你可以花更少的时间等待你的应用程序重新加载。您可以找到更多详情here
【讨论】：
您正在使用的 cli 使用 webpack 来实现这一点。 Webpack 是一个模块捆绑器，它从您嵌入到 index.html 文件中的所有 js/ts/jsx/tsx 文件创建一个捆绑文件。为了实现实时重新加载 webpack 使用 webpack-dev-server（一个小型 node.js 快速服务器). 你可以配置你的 webpack 来观察你的文件的变化，并且 webpack 会在你的代码发生变化时更新你的 bundle 文件。你可以了解更多关于它是如何工作的here。 webpack 的所有配置都写在 webpack.config 文件中。你可以了解更多关于 webpack 的知识here。你也可以关注这个link
【讨论】：
这其实不是一个独立的东西。
发生这种情况是因为 react 使用 webpack 开发服务器，如果您进行任何更改，它会重新加载包。
如果你想做同样的事情，你需要设置一个本地服务器并总是在同一台服务器上进行编辑。 browserSync 也是一个选项，但你需要使用 nodejs
【讨论】：