跨平台开发方案调研

1 uni-app介绍

uni-app 是一个使用 Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。

DCloud公司拥有900万开发者、数百万应用、12亿手机端月活用户、数千款uni-app插件、70+微信/qq群。阿里小程序工具官方内置uni-app，腾讯课堂官方为uni-app录制培训课程，开发者可以放心选择。
uni-app在手，做啥都不愁。即使不跨端，uni-app也是更好的小程序开发框架、更好的App跨平台框架、更方便的H5开发框架。不管领导安排什么样的项目，你都可以快速交付，不需要转换开发思维、不需要更改开发习惯。

2 flutter介绍

Flutter是谷歌的移动UI框架，可以快速在iOS和Android上构建高质量的原生用户界面。 Flutter可以与现有的代码一起工作。在全世界，Flutter正在被越来越多的开发者和组织使用，并且Flutter是完全免费、开源的。

2.1 主要特点

快速开发

Flutter的热重载可帮助您快速地进行测试、构建UI、添加功能并更快地修复错误。在iOS和Android模拟器或真机上可以在亚秒内重载，并且不会丢失状态。
富有表现力，漂亮的用户界面

使用Flutter内置美丽的Material Design和Cupertino（iOS风格）widget、丰富的motion API、平滑而自然的滑动效果和平台感知，为您的用户带来全新体验。
现代的，响应式框架

使用Flutter的现代、响应式框架，和一系列基础widget，轻松构建您的用户界面。使用功能强大且灵活的API（针对2D、动画、手势、效果等）解决艰难的UI挑战。

2.2 安装和配置

2.2.1 Windows

（1）系统配置要求

操作系统：Windows10或更高版本（基于x86-64的64位操作系统）。
系统设置：启用开发者模式。
依赖工具：
- Windows Power Shell 5.0或更高版本。
- Git for Windows 2.x（并勾选从Windows命令提示符中使用Git选项）。

（2）获取Flutter SDK

下载flutter_windows_3.0.5-stable.zip。
解压后将flutter目录拷贝到D盘即可（注意，路径不要有特殊字符）。

（3）更新path环境变量

控制面板->系统和安全->系统->高级系统设置->环境变量->用户变量。
找到path条目（没有则新建path条目），加入flutter/bin的完整路径。

（4）运行flutter doctor检查（根据检查结果，完成依赖配置）。

2.2.2 Linux

（1）系统配置要求

操作系统：Linux64位。
命令工具：bash、curl、file、git 2.x、mkdir、rm、unzip、which、xz-utils、zip。
公用库：libGLU.so.1。

（2）获取Flutter SDK

# 更新软件源
sudo apt-get update
# 安装snap工具
sudo apt-get install snap
# 安装flutter
sudo snap install flutter --classic

（3）运行flutter doctor检查（根据检查结果，完成依赖配置）。

2.3 运行与发布

flutter常用命令：

# 查看帮助
flutter -h
# 创建项目
flutter create Project_Name
# 运行项目
flutter run
	--v				# 查看日志输出
	--release		# 发布模式
	--debug			# 调试模式
	--hot			# 热重载启动
# 查看设备列表
# 设备名称	·	设备ID	·	系统架构	·	系统版本(API版本)
flutter devices
# 切换设备
flutter run -d 设备名称/设备ID
# 安装程序
flutter install
# 查看配置情况	加-v可查看详细情况
flutter doctor
# 升级flutter
flutter upgrade
# 打包apk
flutter build apk
# 添加平台支持
flutter create --platforms=windosw,macos,linux .

2.3.1 运行到Windows平台

# 1.为已有的 Flutter 项目添加桌面支持
flutter create --platforms=windows .
# 2.确保开启开发者模式
start ms-settings:developers
# 3.基于Android Studio IDE开发的移动应用运行到Windows
flutter run -d windows

2.3.2 发布到Windows平台

# 构建发布版本
flutter build windows --release
# 生成的发布版路径为 <Project_Dir>/build/windows/runner/release
# release目录结构如下
.
├── amc1600e.exe		// 可执行程序
├── data				// 包含应用资源文件，如字体和图片
└── flutter_windows.dll	// 必需的动态库文件

2.3.3 运行到Linux平台

# 1.为已有的 Flutter 项目添加桌面支持
flutter create --platforms=linux .
# 2.基于Android Studio IDE开发的移动应用运行到Ubuntu
flutter run -d linux

2.3.4 发布到Linux平台

# 构建发布版本
flutter build linux --release
# 生成的发布版路径为 <Project_Dir>/build/linux/x64/release/bundle
# bundle目录结构如下
.
├── amc1600e	// 可执行程序
├── data		// 包含应用资源文件，如字体和图片
└── lib			// 包含必需的动态库文件

2.3.5 运行到Android平台

在项目路径下，按住Shift，单击右键，选择在此处打开Powershell窗口：

输入flutter devices查看设备列表。
输入flutter run -d emulator-5554。

2.3.6 发布到Android平台

（1）检查APP Manifest

（2）查看构建配置

（3）添加启动图标

（4）APP签名

（5）开启混淆压缩

（6）构建发布版apk

# 构建apk
flutter build apk
# 安装apk
flutter install

3 对比分析

跨平台方案	优点	缺点
uni-app	1. 内部兼容了vue的写法，用于跨平台。 2. 同时支持发布到iOS、Android、Web、多家主流小程序、快应用等多个平台。	1. 很多web库以及第三方web库都不支持。 2.如果想个性化定制功能或UI界面比较难，基本上只能按照uni-app的要求去做。 3. 对移动设备的调试和兼容不太友好。
flutter	1. 快速开发，支持毫秒级热重载。 2. 提供丰富的组件支持，富有表现力和灵活的UI。 3. 自带渲染引擎，不依赖于任何平台，可达到原生应用一样的性能。 4. 开源免费，提供社区支持。 5. 一套代码即可编译成多个平台的应用程序（移动、Web、桌面、嵌入式）。	1. 需要了解dart语言。 2. 需要了解原生开发。