Flutter web 需要刷新浏览器以反映热重启后的变化

Posted 2023-02-23

【中文标题】Flutter web 需要刷新浏览器以反映热重启后的变化

【英文标题】：Flutter web requires browser refreshing to reflect changes after hot restart

【发布时间】：2020-09-27 13:53:21

【问题描述】：

我正在开发一个 Flutter Web 项目并在 chrome 上运行它。每次我进行更改并按r 时，我都会看到以下几行：

Performing a hot restart...                                               
(This is taking an unexpectedly long time.)       -

然后应用程序将完全冻结，热重启将永远持续下去。然后我需要刷新 chrome 浏览器以查看更改。刷新浏览器后，终端给了我以下信息：

Performing hot restart...                                               
216,378ms (!)
Restarted application in 216,380ms.

我正在使用 VS 代码。如果我通过Run > Run Without Debugging运行项目，文件保存时会热重启，我仍然需要刷新浏览器。

我尝试通过flutter run -d web-server 在服务器上运行，网页不再冻结，但仍需要刷新才能显示更改。如果我使用flutter fun -d web-server --verbose 运行，这是终端输出。

[+6946 ms] Performing hot restart...
[  +61 ms] Scanned through 534 files in 59ms
[   +1 ms] Syncing files to device Web Server...
[   +1 ms] <- recompile org-dartlang-app:/web_entrypoint.dart f4f6967d-4b7d-4fa1-ba9a-58ae7c209d8f
[        ] <- f4f6967d-4b7d-4fa1-ba9a-58ae7c209d8f
[  +22 ms] Syncing files to device Web Server... (completed in 24ms)
[   +3 ms] Synced 0.0MB.
[   +3 ms] <- accept
[   +1 ms] Recompile complete. Page requires refresh.
[   +2 ms] Performing hot restart... (completed in 0.1s)
[   +1 ms] Restarted application in 100ms.

该问题并未在项目开始时出现。我不确定是什么导致了这个问题。这是我的医生输出：

[√] Flutter (Channel beta, 1.18.0-11.1.pre, on Microsoft Windows [Version 10.0.18362.836], locale en-SG)

[√] android toolchain - develop for Android devices (Android SDK version 29.0.3)
[√] Chrome - develop for the web
[√] Android Studio (version 3.6)
[!] IntelliJ IDEA Ultimate Edition (version 2019.2)
    X Flutter plugin not installed; this adds Flutter specific functionality.
    X Dart plugin not installed; this adds Dart specific functionality.
[√] VS Code (version 1.45.1)
[√] Connected device (2 available)

! Doctor found issues in 1 category.

请帮我解决这个问题。

【问题讨论】：

请分享您的代码。根据this，目前似乎没有任何问题，但它似乎正在某个时候得到解决。

@ChristopherMoore 感谢您的回复！我有几千行代码，所以我不确定哪一部分是相关的。您链接here 的问题也与我的问题不同。我没有在配置文件模式下运行。

显示自项目开始以来您已更改的代码，否则几乎不可能帮助您，除非您的问题记录在其他地方。我链接的问题在配置文件模式下运行，但它可能仍然相关。

【参考方案1】：

我已经解决了这个问题，虽然我仍然不知道是什么原因。我用有效的初始代码替换了 main.dart 文件。然后我替换回我的代码，问题就消失了。

【参考方案2】：

我也遇到过，还以为是 Flutter web 造成的。最后对我来说，这是来自firebase消息传递插件的这个'onBackgroundMessage'导致了这个问题 https://github.com/FirebaseExtended/flutterfire/issues/4316

【参考方案3】：

这听起来可能很奇怪，我也遇到了同样的问题，chrome 窗口需要某种鼠标输入，只需移动光标就可以了。我的 Flutter 版本是 2.5.3