快应用入坑指南
创建项目
-
PC安装toolkit工具 ( 类似于vue-cli 和 create-react-app )
需要电脑安装node 版本推荐 推荐v6.11.3 及 以上
注意: 不要使用8.0.*版本．这个版本内部ZipStream实现与node-archive包不兼容，会引起报错安装hap-toolkit：
npm install -g hap-toolkithap -V 检查安装是否成功 -
创建第一个快应用项目
hap init <ProjectName>目录结构： 这个项目已经包含了项目配置与示例页面的初始代码，项目根目录主要结构如下。
├── sign rpk 包签名模块 │ └── debug 调试环境 │ ├── certificate.pem 证书文件 │ └── private.pem 私钥文件 ├── src │ ├── Common 公用的资源和组件文件 │ │ └── logo.png 应用图标 │ ├── Demo 页面目录 │ | └── index.ux 页面文件，可自定义页面名称 │ ├── app.ux APP 文件，可引入公共脚本，暴露公共数据和方法等 │ └── manifest.json 项目配置文件，配置应用图标、页面路由等 └── package.json 定义项目需要的各种模块及配置信息 -
安装依赖
npm install -
启动项目 ( 这里可能有坑 )
编译：
npm run build编译生成的 dist 目录里才是最终产物：rpk 文件 手机会下载该文件进行安装，才可以启动项目
按照官方文档一直走，到 npm run build 时，报错： "Cannot find module '.../node_modules/hap-tools/webpack.config.js'"
主要是因为创建项目后就有一个 node_module 文件夹了，里面有一个 hap-tools 包。如果 npm install 安装依赖，高版本的 npm 可能会把 node_module 原有的包清空再安装依赖，这时只要再手动安装下 hap-tools 就行了
npm install hap-tools
或者请运行一次 hap update --force（执行完毕后不需要按照提示再次运行npm install）就可以了。
如果要监听源码变化，实现自动编译，可以运行 npm run watch 命令。
npm run watch
编译打包成功后，项目根目录下会生成文件夹：build、dist
- build：临时产出，包含编译后的页面js，图片等
- dist：最终产出，包含rpk文件。其实是将build目录下的资源打包压缩为一个文件，后缀名为rpk，这个rpk文件就是项目编译后的最终产出（相当于一个app的安装包）
-
预览快应用：手机安装调试器、 平台预览版调试器[（官方地址）][1]，或者点击下面得链接直接下载：
调试器：
[调试器下载地址][2]
[平台预览版调试器][3]
安装完成后，打开快应用调试器，界面如下：
![此处输入图片的描述][4]
可以看到有两种安装方式：扫码安装、本地安装。
- 扫码安装：在项目的根目录打开一个终端窗口，执行：
npm run server
执行结果如下：
![二维码][5]
也可以再浏览器打开 servers 地址查看刚才生产的二维码。点击快应用调试器的 扫码安装 按钮就可以了（注意：部分机型可能会安装失败，这里建议使用小米手机）。
-
本地安装
-
复制rpk包到手机中
将
/dist目录下编译产出的rpk包通过USB数据线或其他方式，复制到手机文件系统中 -
本地安装rpk包
打开调试器 --> 点击"本地安装"，选择手机文件系统中的rpk包，并自动唤起平台运行rpk包，查看效果
-
预览：提示安装成功后，就可以点击调试平台的在线更新预览效果了。
代码编辑配置
Visual Studio Code ，配置语法支持只需要安装 Hap Extension 插件即可。
开发与调试
-
远程调试（电脑调试）：
还记得前面让大家执行npm run server开启node服务，这里就是依赖这个服务器实现电脑调试的。
快应用安装成功后，点击 开始调试 按钮，电脑就会在默认浏览器 打开一个与手机同步的调试页面，页面默认打开 chrome devtools 调试界面，方便大家调试代码。
注意：使用远程调试请确保手机与 PC 在同一局域网，手机不要开代理，否则无法打开快应用。 -
日志输出
有些同学在第一次开发快应用时候会发现，在代码里面 执行日志打印console.log（）没有效果。这是因为快应用的日志打印需要配置，默认是不允许日志打印的。
打开工程根目录下的src文件夹的manifest.json，找到config配置，修改代码如下就可以实现日志打印了：
"config": {
"logLevel": "debug"
}
- 到这里我们的第一个快应用就开发完成啦，想要了解其他高级功能，可以查看快应用的开发文档。