在浏览器中查看 React 和 Flask Fullstack 的更新

Question

我是使用 React 和 Flask 的新手，我从遵循本教程 https://codeburst.io/creating-a-full-stack-web-application-with-python-npm-webpack-and-react-8925800503d9 开始，并完成了示例全栈网站的构建。我的代码是作者在其 github 页面https://github.com/angineering/FullStackTemplate 上的示例中代码的精确副本。但是，当我更改文件中的任何内容时，重新构建项目，启动 server.py 文件，然后在浏览器的新选项卡中打开服务器端口 http://127.0.0.1:5000/ ...没有任何更改或更新。如果我将文本名称从“Remini”更改为“Kai”并重建并重新加载，Web 应用程序仍会运行“Hello Rimini”。

我尝试关闭服务器并重新打开、重新启动 Chrome 并重新构建，但没有任何改变。当我在 Firefox 中打开服务器时，根本没有加载任何数据，而不是索引页面或背景图像。当我在 Chrome 上查看源代码时，我可以看到我在构建之前所做的更改，例如添加 html 元素，因此我知道构建成功，但名称文本没有改变。另外，如果我添加另一个背景图像并更改 css 以加载替代图像，原始图像仍会作为背景图像加载。

我认为这是服务器和浏览器的问题，并且无法弄清楚如何连接到正确的端口以将更改加载到 javascript（在本例中为 jsx）。我的问题是，如何使用 npm 构建这个 React/Flask Web 应用项目并让我的浏览器在 Web 浏览器中反映我对项目的更改？

Answer 1

我似乎找到了问题所在。 Chrome 正在缓存该站点，当我打开开发人员工具并右键单击重新加载按钮以“清除缓存并硬重新加载”时，加载了正确和更新的构建。