flutter移动项目迁移flutter_web准备阶段脱坑
前言
从2018年Google推出flutter后就很受欢迎,于是自己就尝试设运用一下将公司的一个项目使用flutter进行部分功能实现,效果还是不错的,流畅度还是个人感觉还是可以接受的;这边GoogleI/O2019发布Flutter web版本后,当然还没有提供正式版SDK,想要对之前的项目做web端适配还有些工作要是,最近工作没有那么忙了于是自己就打算尝试将之前的flutter项目迁移到web端,由于不完善这中间走了不少弯路。
准备
开始前先看官方文档:https://github.com/flutter/flutter_web
文档明确指出目前的flutter_web处于实验阶段,使用了单独的命名空间,就是我们目前提供的sdk移动和web段是分开的,需要对已有的移动项目改造才能在web平台运行,并且文档指出我们的建议我们是1.5.4以上版本来进行web端的支持
开始迁移
1.安装webdev包 使用如下命令进行:
flutter pub global activate webdev
使用该命令的前提是我们已经配置了flutter环境变量(环境变量配置路径为“fluttersdk安装路径\flutter\bin”,‘fluttersdk安装路径’根据自己安装请况定)
2.修改原有项目中的引用,官网文档提供的配置如下(并移除asset和字体相关的配置):
name: my_flutter_web_app
environment:
sdk: '>=2.2.0 <3.0.0'
dependencies:
flutter_web: any
flutter_web_ui: any
dev_dependencies:
build_runner: ^1.1.2
build_web_compilers: ^1.0.0
dependency_overrides:
flutter_web:
git:
url: https://github.com/flutter/flutter_web
path: packages/flutter_web
flutter_web_ui:
git:
url: https://github.com/flutter/flutter_web
path: packages/flutter_web_ui
3.提供web端配置:
根目录添加web文件夹并在其中创建index.html与main.dart文件
index.html文件内容如下:
<!DOCTYPE html>
<html lang="en">
<head>