环境说明:

系统环境:Mac mini M2 14.5 (23F79)
开发IDE:DevEco Studio 5.0.1 Release

配置步骤:

按着官方的指引来慢慢一步一步来,但前提是要配置好SDK的路径(没有配置的话,可能先看下面的配置说明)
》》》 使用DevTools工具调试前端页面
在这里插入图片描述

SDK配置:

第一步:找到sdk的安装目录
PS:我是从旧版本看升级到新的DevEco,打开的时候Location是没有值的,即对应的目录下没有安装sdk,不断点击下一步安装即可
在这里插入图片描述

在这里插入图片描述
第二步:配置环境变量
在.zshrc文件添加下面的代码(具体目录根据自己的环境做调整)

# 鸿蒙sdk
HMOS_HOME="/Users/ericluo/Library/OpenHarmony/Sdk"
export HMOS_HOME
export PATH="${PATH}:${HMOS_HOME}/13/toolchains"

配好后,记得在当前shell,source一下
在这里插入图片描述

然后接下来按官网指引操作即可, 一路正常下来,再打开 chrome://inspect/#devices
看到对应的H5页面,点击inspect就可以调试页面了
在这里插入图片描述

重要

当一步一步走通后,后面就有官网的脚本来一键运行调试了(预计后续sdk升级,该脚本会整合到sdk的工具当中)
Linux或Mac平台

#!/bin/bash

# Get current fport rule list
CURRENT_FPORT_LIST=$(hdc fport ls)

# Delete the existing fport rule one by one
while IFS= read -r line; do
    # Extract the taskline
    IFS=' ' read -ra parts <<< "$line"
    taskline="${parts[1]} ${parts[2]}"

    # Delete the corresponding fport rule
    echo "Removing forward rule for $taskline"
    hdc fport rm $taskline
    result=$?

    if [ $result -eq 0 ]; then
        echo "Remove forward rule success, taskline:$taskline"
    else
        echo "Failed to remove forward rule, taskline:$taskline"
    fi

done <<< "$CURRENT_FPORT_LIST"

# Initial port number
INITIAL_PORT=9222

# Get the current port number, use initial port number if not set previously
CURRENT_PORT=${PORT:-$INITIAL_PORT}

# Get the list of all PIDs that match the condition
PID_LIST=$(hdc shell cat /proc/net/unix | grep webview_devtools_remote_ | awk -F '_' '{print $NF}')

if [ -z "$PID_LIST" ]; then
    echo "Failed to retrieve PID from the device"
    exit 1
fi

# Increment the port number
PORT=$CURRENT_PORT

# Forward ports for each application one by one
for PID in $PID_LIST; do
    # Increment the port number
    PORT=$((PORT + 1))

    # Execute the hdc fport command
    hdc fport tcp:$PORT localabstract:webview_devtools_remote_$PID

    # Check if the command executed successfully
    if [ $? -ne 0 ]; then
        echo "Failed to execute hdc fport command"
        exit 1
    fi
done

# List all forwarded ports
hdc fport ls
Logo

讨论HarmonyOS开发技术,专注于API与组件、DevEco Studio、测试、元服务和应用上架分发等。

更多推荐