eeui 安卓开发 -- 如此简单

介绍

本教程写用 eeui 框架的环境搭建及开发调试

eeui 介绍

使用 Vue.js 跨平台开发高质量原生（Android/iOS）应用。

eeui 支持实时同步预览，即修改完代码可以立即查看效果

项目环境

基本环境

编辑器：Visual Studio Code（其他编辑器都可以，推荐 VSCode）

安装node（已安装省略）

查看 node 版本号

node –v  

安装 eeui

目前最新版：

eeui-cli: 2.2.3-RC3

eeui-template: 2.2.3

命令：

npm install eeui-cli –g   cli -g

查看 eeui 版本号：

eeui –v  

生成开发模版

使用 eeui-cli 的 create 命令来创建模版工程（projectName 为你要创建的项目名称）

命令：

eeui create projectName  

然后进入开发目录，执行 npm install 加载 node_modules Node.js 基础模块

命令：

 cd projectName  npm install  npm run dev 

App 设置

命令：

 eeui setting 

安装 Android Studio

开发调试

实时预览

下载真机调试工具：eeui.app

地址：下载eeui.app

或扫描 eeui 二维码下载

只需要在项目根目录中起开发服务：npm run dev，脚手架会在项目 common 目录下生成 dist 文件，存放 JS Bundle。

注：使用真机调试需要将手机与起服务的[pc|mac]连接到同一个局域网内！！！

编译成功后：Build completed! 会生成真机调试 ip 地址和端口号

项目目录结构

后台连接地址配置路径：\src\ config.js

热刷新

eeui 现已支持热刷新，即修改完代码保存（command + s 或 ctrl + s）的时候，页面会自动刷新

点击 App 屏幕上的 DEV–> WiFi 真机同步按要求输入上文开启开发服务生成的 IP 地址、端口号即可完成同步刷新。

注：热刷新只有在npm run dev服务下才会生效。

打包（用 Android Studio）

打开 Android Studio

在 Android Studio 打开 Android 项目

打开的路径是：项目目录下\platforms\android\eeuiApp

注意：第一次打开得等一会，因为会生成安卓其它包

编译完成后如下图：

然后：

打包：

签名文件

签名别名：android.keystore

签名密钥：******

打包完成后会生成安装包到：项目目录下\platforms\android\eeuiApp\app\release

真机调试（用 Android Studio 连接 usb）

好处是比 eeui APP 调试更接近真机的体验，因为一些插件 eeui APP 中不可用，如 eeui APP 里调不起来 qq 和微信插件

手机打开开发者模式

手机与 Android Studio 连接 USB 调试

编译完成后手机会自动打开项目 app

注：也支持热刷新 热刷新只有在npm run dev服务下才会生效

可能会有调试包缓存问题，删除调试历史版本（安装包到手机出现问题时，在 Android Studio 终端运行） :

adb uninstall com.demo.test（包名）

配置

配置 APP 启动图闪屏倒计时广告

eeui.config.js 中 appKey 用于匹配本 app

设置：

配置版本更新

设置：

总结

其实安卓开发并不难，选择好框架，一步一步去实践，你会有意想不到的收获