写在前面
前段时间闲来无事，听朋友提到过uni-app，说它写一套代码，可多端（H5、android、IOS、微信小程序、支付宝小程序、头条小程序等等）打包，还是基于VUE封装的、听着很神奇，再加上我以前就有想法做一个属于自己的移动端应用，相对于做一款真正的android、ios应用来说，uni-app的门槛已经算是很低了，于是我就开始了盘uni-app之旅了，坑很多，且听我一一道来。
一、本篇教程侧重点导读
- 下载安装
- 新建一个HBuilderX应用及打包
- android打包配置
- 打包成android应用
- 坑一
- 坑二
- uni-app之我见
二、本篇教程用的软件、技术和说明
- HBuilderX版本：2.7.14
- Android-SDK版本：2.7.14
三、下载安装
开发工具下载：需下载HBuilderX、需要打包成Android应用需要下载Android-SDK、Android Studio（打包时用）
本篇文章只说从新建uni-app到打包成apk的过程，打包成ios、微信小程序等需要自己去官网看教程（应该都蛮简单）
四、新建一个HBuilderX应用及打包
- 这里直接新建一个带基础插件的uniapp模板项目，这里选项里面自带了所有的实用插件，到时候写项目的时候不用一个个下载了
- HBuilderX直接打包刚刚新建的前端项目：
- 成功打包前端项目后会输出如下目录
五、android打包配置
- 打开Android Studio编辑器，导入Android-SDK中自带的项目，等待编辑器自动构建完成：
备注：之所以导入HBuilder-Integrate-AS是因为这个自带了uni-app打包成apk的SDK工具，不要再复制粘贴了 - 将在HBuilderX中打包好的前端项目导入到apps文件夹中，并删除这里面的示例项目
六、打包成android应用
修改如下几个地方的配置：
引入uni-app的SDK：
将下图一中的uniapp-release.aar包放到图二位置
再把项目中的simpleDemo模块给删除掉，再自动构建一遍
打包成apk：
点击这里
第一步
第二步
备注：这里的keystore可以用java生成一个免费的，百度即可
最后一步
安装app后看效果：
安装完毕后打开能看到这个页面就说明打包成功：
七、坑一
HBuilderX的版本和Android-SDK的版本需要一致，不然打包出来的app会有白屏的现象；
八、坑二
最开始打包成apk的时候可能会报错：
解决方案：将报错提示的模块复制粘贴到app模块下的build.gradle文件里面去，在重新编译打包即可
九、uni-app之我见
- uniapp主打一套代码，各端编译。确实很吸引人，只有真正的摸过这个框架才知道这里面的水还是蛮深的，如果真想一套代码发布成app、各端小程序的话累死你，踩坑能踩到你断气！
- uniapp出自国产，开箱即用，基于vue，上手简单，支持是必须的，更新迭代也非常快，也正是因为能多端编译，只有真正了解里面的套路之后才能快速开发；
- uniapp的插件我感觉都是出自个人之手，并非官方，所以很多插件bug多多！官方最喜欢搞什么插件大赛，让各路牛鬼蛇神去参加，好的插件就可以放到插件市场，供开发者使用，基础插件好用到是好用，但是高级点的就bug多多或者作者收费；（bug多也正是因为个人插件没有全平台测试就发布出来，用的人不小心就成了踩坑倒霉蛋了）
- 可能uniapp的官方团队重心放在各端的SDK版本迭代和bug修复上，周边插件上并不是那么完善
