Flutter作为一个可移植的UI框架，已经支持现代Web应用开发了！ 我们很开心已经发布了SDK预览版，这样你可以在Web浏览器里直接运行你的Flutter UI代码。
从去年Beta版发布以来，我们现在已经可以直接使用flutter sdk来支持web应用了，网上有太多早期 flutter for web 的新手教程，大家在还是跟着官方文档尝试以下吧。
简单来说就分几步
google 已经把 flutter_web merge 到 flutter 主工程，但是现在看起来还是 beta 版本才能使用 flutter_web.
所以我们要先切换分支
flutter channel beta
flutter upgrade
flutter config --enable-web创建和运行
flutter create flutter_web_dome
cd flutter_web_dome
flutter run -d chrome当然也可以将已经存在的工程做web支持：
flutter create .当然这并不是重点，官方文档上很清楚，一步一步跟着做就是了。
如果上面的步骤都没问题，我们应该会看到这个页面。
然而，事情就是没有这么的顺利，我的页面一直是这样
是的 你没有看错，一个空白的页面，log没有输出，没有任何的错误提示，刚开始也为是防火墙端口问题，后来也调试了相关浏览器的设置，sdk版本更新等等问题。都无解，就在我对着白屏发呆的时候，它自己刷新出现了... 马上查看控制台一切正常，log也输出了，那么这个白屏应该就发生在我们程序代码执行之前，在run以下，又是白屏，这次没有这么幸运，始终没有加载出来。查看了github遇到此问题的还真不少，https://github.com/flutter/flutter/issues/61464。在这里也没有找到有用的答案。于是这个问题被我就困扰了我好几天，终于在一个朋友的buff加持下，又有了灵感。
===========================================言归正传================================================
研究了以下配置信息发现了一个关键的地方，问题可能出现在渲染程序上。在翻了几遍文档之后，发现了一些端倪。
Flutter在运行和构建Web应用程序时，可以在两个不同的渲染器之间进行选择。 这两个渲染器是：
- HTML。CSS，Canvas元素和SVG元素。 该渲染器的下载大小较小。
- Canvaskit。使用Skia编译为WebAssembly并使用WebGL渲染。 该渲染器与Flutter移动设备和台式机完全一致，具有更快的性能，并且不太可能在浏览器之间出现差异，但下载大小增加了大约2MB。
Flutter官方文档上对这个选项的默认设置的说明是，当应用程序在移动浏览器中运行时，此选项选择HTML渲染器；当应用程序在桌面浏览器中运行时，选择CanvasKit渲染器。那么看样子系统为我们设置的是CanvasKit渲染器。
于是分别用命令：
flutter run -d chrome --web-renderer html
flutter run -d chrome --web-renderer canvaskit使用html的显示出了正常的页面，而使用canvaskit的则显示空白页面。那么到目前位置，我们基本也可以定位，应该是浏览器下载CanvasKit出错导致的问题。于是，经过了一系列的科学上网设置，问题解决。