快应用的开发和调试

快应用的开发和调试

在课程的大纲

  • 开发工具的介绍
  • 使用日志输出
  • 远程调试

开发工具

在快应用的开发工具中,

第一种:Visual Studio Code

可以在下载连接地址

Visual Studio Code 安装后没有支持hap的,需要安装插件 Hap Extension

启动 Visual Studio Code,点击左上铡扩展,搜索 hap,然后点击安装
Hap Extension,如下图所示:


快应用的开发和调试_第1张图片
WechatIMG102.jpeg

效果展示
想了解Hap Extension的支持的功能,详见Hap Extension

快应用的开发和调试_第2张图片
WechatIMG103.jpeg

第二种:WebStorm

可以在下载连接地址

启动WebStorm,打开项目,点击顶部菜单栏File --> Settings,打开WebStorm配置界面

在配置界面选择Editor --> File Types,找到HTML,增加通配符*.ux,如下图所示:


快应用的开发和调试_第3张图片
WechatIMG104.jpeg

效果展示


快应用的开发和调试_第4张图片
WechatIMG105.jpeg

使用日志输出

  • 修改日志等级

打开工程根目录下的src文件夹的manifest.json,找到config配置,将logLevel修改为最低级别debug,即:允许所有级别的日志输出

{
   "config": {
   "logLevel": "debug"
      }
}
  • 在js中输出日志

    console.debug('debug')
    console.log('log')
    console.info('info')
    console.warn('warn')
    console.error('error')
    

远程调试

在项目根目录下执行如下命令,启动HTTP调试服务器:

npm run build
npm run server

在手机必须安装快应用调试器App的前提条件下,执行以下操作:

  • 开发者可以通过命令行终端或者调试服务器主页看到提供扫描的二维码
  • 开发者通过快应用调试器扫码安装按钮,扫码安装待调试的rpk文件
  • 开发者点击快应用调试器中的开始调试按钮,开始调试

效果展示


快应用的开发和调试_第5张图片
WechatIMG106.jpeg

开发群,有意愿讨论,请加入

快应用的开发和调试_第6张图片
WechatIMG120.jpeg

你可能感兴趣的:(快应用的开发和调试)