Flutter Web在Chrome调试时显示空白页面问题求助

以下是针对该问题的针对性排查和解决步骤：

• 检查IntelliJ的Chrome启动配置
  打开Run/Debug Configurations → 选中你的Flutter Web调试配置：

  1. 确认Launch选项为Chrome，且URL栏正确填写了http://localhost:<端口号>（比如http://localhost:42827）；
  2. 查看Browser区域，取消勾选Incognito mode（隐身模式可能导致Flutter资源加载异常）；
  3. 检查Additional run args是否存在异常参数，比如--disable-javascript这类会阻断页面运行的参数，如有则删除。

• 重置IDE与Chrome的关联

  1. 关闭所有Chrome进程：在终端执行 killall google-chrome；
  2. 打开IntelliJ的Settings → Tools → Web Browsers，找到Chrome，点击Edit按钮，确认路径为/usr/bin/google-chrome（Ubuntu默认路径），若路径错误则重新指定；
  3. 重启IntelliJ后再次尝试调试。

• 调整Flutter Web启动参数
  在终端手动启动Flutter Web，验证是否为IDE配置问题：

  flutter run -d chrome --web-port=42827 --web-renderer=html
  

  若该命令能正常打开Chrome并加载页面，说明是IDE的启动参数问题，可将--web-renderer=html添加到IntelliJ调试配置的Additional run args中，强制使用HTML渲染器（部分环境下CanvasKit渲染器会出现兼容性问题）。

• 清理项目与浏览器缓存

  1. 执行项目清理：

     flutter clean
     flutter pub get
     

  2. 打开Chrome，按Ctrl+Shift+Del，选择“缓存图片和文件”进行删除，关闭Chrome后再从IDE启动调试。

• 同步插件与SDK版本

  1. 更新IntelliJ的Flutter/Dart插件：Settings → Plugins，找到Flutter和Dart插件，检查并安装最新版本；
  2. 切换Flutter到稳定版并更新：

     flutter channel stable
     flutter upgrade
     

内容的提问来源于stack exchange，提问作者MohammadBaqer