在已有的Flutter项目上运行Web支持

起因是想让iPhone手机使用浏览器查看APP效果.

run web

  • 如果你看到这里, 建议你将SDK升级到1.12+, 因为我在run web 的时候遇到一个SDK的bug, 起初我以为是三方lib的bug, 后来我在issues#39271了解到需要更新SDK, bug如下:
AssetNotFoundException: flutter_easyrefresh|lib/src/footer/load_indicator.ddc.js
Error compiling dartdevc module:flutter_easyrefresh|lib/bezier_bounce_footer.ddc.js
  • 首先你必须安装 chrome浏览器
  • 开启Web支持
flutter config --enable-web
  • 使用 flutter devices 检查可运行的设备(目前只支持Chrome)
flutter devices
1 connected device:

Chrome • chrome • web-javascript • Google Chrome 76.0.3809.100
  • 添加web支持, 在根目录下新建web文件夹(web和lib文件夹同级), 然后新建index.html文件, 文件内容如下:
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>education_flutter</title>
</head>
<body>
  <script src="main.dart.js" type="application/javascript"></script>
</body>
</html>
  • 然后就可以Run web app 了
flutter run -d chrome
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容