「这是我参与11月更文挑战的第1天，活动详情查看：2021最后一次更文挑战」
一.使用uniapp开发的优缺点
从开始正式工作开始到现在, 一直使用uniapp开发微信小程序或者APP. uniapp是一个非常容易上手的框架, 同时也伴随着一些可大可小的坑. uniapp官方推荐的编写软件是HBuilderX .今天就说一下使用HBuilderX编写uniapp的优缺点, 以及开发不同的项目之间的区别.
优点
- uniapp使用vue.js开发前端应用的框架.--------(正是由于uniapp是基于vue.js的,所以对于有vue基础的小伙伴是非常友好的, 下载就能上手敲);
- 开发者编写一套代码, 可发布到IOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/QQ/快手/钉钉/淘宝)和快应用等多个平台.------(我前段时间写了一个项目, 需要发布到专有钉钉, 开发过程真是一言难尽, 好在说服甲方改成微信小程序);
- 既然支持那么多小程序, 定然也能打开相对应的小程序的开发工具. 这个功能用着最爽;
- HBuilderX开发APP时, 可以运行到真机查看效果. 不用担心发布之后效果和测试的时候有差别.
缺点
- uniapp支持开发很多种类的项目, 这是它的优点, 也是它的缺点. 例如有的组件的属性或者API, 可以在开发APP中使用, 不能在小程序中使用等. 不可能所有的类型都兼顾.
- 在使用HBuilder的时候会出现闪退的情况, 真机运行的时候也会出现白屏等情况. 每次都需要重新运行, 运行一次两分钟.
- uniapp官方给的组件中, 比如下拉刷新的组件, 会有很多坑, 后面我会写避坑文章.
二.运行HBuilder, 创建新的uniapp项目并运行
2.1.创建uniapp空项目
- 点击文件 => 新建 => 项目
- 点击uni-app, 输入项目名字, 选择存放地址和模板(选择默认模板), 点击创建
2.2.创建uniapp模板
uniapp官方推荐几个uniapp模板, 用来演示uni-app框架的组件、接口、模板等, 以及一些项目模板(电商模板).可以创建只有运行查看组件/API等的使用方法
- 点击文件 => 新建 => 项目
- 点击uni-app, 输入项目名字, 选择存放地址和模板(选择相对应的模板, 演示组件、接口、模板的模板名称为Hello uni-app), 点击创建
2.3.运行项目
2.3.1 运行到微信小程序
- 首先要创建一个项目以及已经下载了微信开发者工具, 点击manifest.json => 点击微信小程序配置, 输入微信小程序AppID.
- 点击运行 => 运行到小程序模拟器 => 运行设置 => 运行配置 => 小程序运行配置 => 微信开发者工具路径 => 点击浏览找到微信开发者工具路径
2.3.2 运行到手机或模拟器
- 创建项目
- 使用数据线连接电脑和手机, 在手机上信任此电脑.
- 点击运行 => 运行到手机或模拟器 => 制作自定义调试基座
- 选择Android
- 使用公共测试整数
- 打自定义调试基座
- 传统打包
- 点击运行 => 运行到手机或模拟器 => 运行基座选择 => 自定义基座
- 点击运行 => 运行到手机或模拟器 => 选择手机型号
