开发第一个快应用

闲来无事,撩撩新技术!

参考:【快应用开发文档】

环境搭建

一、安装nodejs

需安装6.0以上版本的nodejs,请从NodeJS官网下载,推荐v6.11.3 LTS

直接打开6.11.3的链接地址:https://nodejs.org/dist/v6.11.3/

版本目录.png

注意: 不要使用8.0.版本.这个版本内部ZipStream实现与node-archive包不兼容,会引起报错*

二、安装hap-toolkit

node.js下载安装完成后,打开命令行窗口

输入命令npm install -g hap-toolkit

安装hap-toolkit等待.png

安装过程可能会需要一段时间,请耐心等待,安装完成如下图所示


安装hap-toolkit完成.png

在命令行中执行hap -V会输出版本信息表示hap-toolkit安装成功。

新建项目

一、创建第一个项目(FirstQuickApp)

找到合适的文件夹,打开命令行输入命令hap init 自定义项目名,出现prompt: Init your Project: (FirstQuickApp)后再次输入项目名,我这里是由于配置问题只能在node_global下执行命令

创建第一个项目.png

创建完成后,在当前目录下可以查找到项目


FirstQuickApp创建完成.png
二、编译项目

到项目根目录FirstQuickApp下,打开命令行输入命令npm install安装依赖包;

再输入npm run build编译生成rpk包;

这样就已经完成了第一个快应用的创建和打包

如果希望每次修改源代码文件后,都自动重新编译项目,可继续输入命令npm run watch

调试应用

一、手机安装调试器

调试器APK是一个Android应用程序,下载地址 快应用调试器

安装后,打开调试器


快应用调试器.png

说明如下:

  • 扫码安装:配置HTTP服务器地址,下载rpk包,并唤起平台运行rpk包
  • 本地安装:选择手机文件系统中的rpk包,并唤起平台运行rpk包
  • 在线更新:重新发送HTTP请求,更新rpk包,并唤起平台运行rpk包
  • 开始调试:唤起平台运行rpk包,并启动远程调试工具

注意:若无法正常使用调试器,请升级手机系统到最新版本或安装平台预览版

二、手机安装平台预览版

较新的系统版本中内置平台正式版,即真实的运行环境。如果你的调试器可正常使用,这步可不必理会。

平台预览版同样是一个apk,下载地址 平台预览版

注意:如果你安装后打开看到的是一个空白页面,属于正常情况,退出打开调试器,你会发现已经可以点击了

三、在平台运行rpk包

通过调试器,可以看出有两种方式:扫码安装、本地安装。

1.本地安装

在FirstQuickApp/dist/下找到rpk包,复制到手机中,再点击调试器本地安装,选择该rpk包即可。

2. 扫码安装(推荐)

进入项目的根目录打开命令行,执行命令npm run server,启动本地服务器(默认端口为12306)。

如果想要修改端口号(如:8080),执行命令npm run server -- --port 8080

上述操作会在终端展示一个生成http服务的二维码和服务器地址,手机预览效果也有两种途径:

  • 快应用调试器 ==> 右上角设置 ==> 输入服务器地址 (请确保手机与服务器在相同网段)
  • 快应用调试器 ==> 扫码安装 ==> 扫描命令行窗口生成的二维码(如果扫描失败,浏览器输入服务器地址打开页面,扫描页面中的二维码)

配置完成后,若没有自动唤起平台运行rpk包,点击在线更新唤起平台运行rpk包。

建议:从项目根目录打开两个命令行窗口,一个运行npm run watch可以自动编译更新rpk,一个运行npm run server可以在浏览器查看调试。

编辑开发

只要能编辑,哪怕记事本也行。官方推荐两款开发工具:Visual Studio CodeWebStorm

为了方便开发,如果使用VSCode添加扩展hap Extension;如果使用WebStorm,在设置中增加对ux格式文件的支持。

参考 【代码编辑配置】

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,088评论 5 459
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,715评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,361评论 0 319
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,099评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 60,987评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,063评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,486评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,175评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,440评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,518评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,305评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,190评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,550评论 3 298
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,880评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,152评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,451评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,637评论 2 335

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,042评论 25 707
  • 【声明:】本文是作者(蘑菇v5)原创,版权归作者 蘑菇v5所有,侵权必究。本文首发在简书。如若转发,请注明作者和来...
    蘑菇v5阅读 2,116评论 0 0
  • 什么是 NPM npm之于Node,就像pip之于Python,gem之于Ruby,composer之于PHP。 ...
    ihoey阅读 6,241评论 2 36
  • 春夏秋冬,寒暑交替,一年四季,亘古不变,无可逆转。 期待中的三月,充满纠结的三月,渐行渐远。渐行渐远的岁月一同带走...
    蓝色海洋123阅读 280评论 0 2
  • 一觉睡到了8:00,感觉好舒服。昨晚和美玲、任利的聊天:看到利爷不断前进的步伐,只是觉得自己在未来的道路上应...
    娜娜是最美的小仙女阅读 162评论 0 0