快应用开发之初体验

1. 环境搭建及开发调试

  • 开发需要安装一个npm包hap-toolkit来生成初始化项目,类似vue-cli;
  • 移动端调试器安装,需要andorid手机,去官网资料中心下载apk;
  • 项目初始化后,使用npm run watch以及npm run server,通过快应用调试器扫码进入,就可以hot reload了,开发体验不会太差;
  • 项目初始化出的模板,从package.json依赖来看,webpack需要升级,太老旧,是1.x的版本;
  • 使用vConsole来作为调试控制台,无法安装到快应用中;调试使用快应用调试器提供的调试吧(需要在manifest开启日志,默认off),它是直接打开默认浏览器,然后接着玩儿;

2. 项目配置信息

  • 路由在这里配置;
  • 页面级别的信息如页面标题以及标题颜色、标题背景灯,也在这里配置;
  • 应用基本信息; 3.框架

大体上

  • 写法跟vue类似;
  • 生命周期跟微信小程序类似;
  • 页面级别的数据在private对象中,类似小程序的data对象;但是调用又跟vue类似,private的数据都挂载在this实例上,不像小程序的data数据是挂载在this实例的data对象上;
  • 路由参数传递,两种方式分别是a链接的query和router模块params参数传递,参数接受有两种方式,一种是protected对象,一种是public对象,他们的区别是protected是应用内部参数传递,public负责接收应用外部的参数传递;
  • 数据量大的时候,可以用$app实例上的$data来传递参数;
  • 数据请求可以使用快应用提供的@system.fetch模块
  • 现在app.ux中还不支持公用样式(官方:加了的话,担心性能会变差) 模板
  • 文字一定要放在text中,否则不显示(坑);
  • 不支持单位vw,vh;

逻辑

  • dom事件模型在快应用中不适用;

css样式( 由于快应用最终效果是native不是h5,用的是css的子集,坑较多)

  • css样式不需要写兼容,已经默认集成, 写兼容还可能会报错,默认border-box盒模型,不支持content-box和box-sizing;
  • 没有块元素、行内元素的模型;
  • css样式中的颜色值只严格支持16进制,不能使用缩写,不能使用语义颜色(还有这种操作,无语);
  • css样式中background只设置颜色的话,需要使用background-color,否则报错;
  • 不支持相对定位和绝对定位,支持固定定位;
  • 不支持float布局;
  • 不支持overflow属性;
  • 不支持伪元素选择器,如::before, ::after;
  • flex属性不支持缩写,如flex: 1 0 auto;是不支持的,只能单独写flex的属性;
  • 不支持样式中使用!important;
  • 不支持vertical-align属性;
  • 框架目前仅支持长度单位px和%, 当然不支持单位vw,vh;

4.组件

  • 自定义组件的引入方式是在模板使用import标签引入;

5.接口

  • 接口模块使用,需要在manifest.json中声明(特别是使用web组件时,需要声明,单无需引入模块);
  • 推送模块暂时还未支持(截止20180629);
  • 快应用限制唤起其他app的能力(https://bbs.quickapp.cn/forum.php?mod=viewthread&tid=282&highlight=webview);

6.发布部署

  • 需要在项目中的sign文件夹下添加release签名,然后npm run release,会生成有release签名的工程包,这个包就可以用于部署;
  • 部署是需要申请一个快应用的账号,通过后台上传相关项目资料;
  • 上传包的时候命名规则与app一致,版本管理要注意,快应用后台会检测versionCode,每次发布需要比上次发布的versionCode大;

后续会持续补充…

发表评论

电子邮件地址不会被公开。 必填项已用*标注