接入 Lynx DevTool

当你开发 Lynx 页面遇到问题时,可以使用 DevTool 进行调试。 但你需要先按照以下步骤接入 DevTool。

INFO

推荐在非生产环境下接入 DevTool,让生产环境的应用更轻量。

下文中的所有代码,你都可以在 integrating-lynx-demo-projects 项目中找到

引入依赖

你需要新增以下两个组件: LynxServiceDevtool 子组件和 LynxDevTool

Podfile
target 'YourTarget' do
  pod 'LynxService', '3.2.0-rc.0', :subspecs => [
      'Devtool',
  ]
  pod 'LynxDevtool', '3.2.0-rc.0'
end

打开 DevTool

DevTool 提供了一些调试功能开关, 其中有三个比较重要的开关:

  • Lynx Debug 是 DevTool 的总开关,其控制 DevTool 的所有调试功能。
  • Lynx DevTool 控制 DevTool 的基础调试功能:元件审查和 JavaScript 调试。
  • Lynx LogBox 控制 LogBox 功能。
这三个开关默认是关闭的,建议同步开启这三个开关
  • 使用 DevTool 桌面应用调试 Lynx 页面时,需要同时打开 Lynx Debug 和 Lynx DevTool 开关
  • LogBox 可以帮助你快速发现问题

你可以在初始化 LynxEnv 时打开设置这三个开关:

Objective-C
Swift
AppDelegate.m
@implementation AppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
  // ...
  // 打开 Lynx Debug 开关
  lynxEnv.lynxDebugEnabled = YES;
  // 打开 Lynx DevTool 开关
  lynxEnv.devtoolEnabled = YES;
  // 打开 Lynx LogBox 开关
  lynxEnv.logBoxEnabled = YES;
  return YES;
}
INFO

除了前面介绍的三个开关外,还有更多开关可以帮助你控制 DevTool 的行为,请参考 Lynx DevTool 开关页面

引入依赖

你需要接入这两个组件: lynx-service-devtoollynx-devtool

build.gradle
build.gradle.kts
// Lynx DevTool 接入时请保证和 Lynx 相同版本
dependencies {
  implementation "org.lynxsdk.lynx:lynx-devtool:3.2.0-rc.0"
  implementation "org.lynxsdk.lynx:lynx-service-devtool:3.2.0-rc.0"
}
INFO

推荐接入时使用最新 Lynx 版本

注册 DevTool Service

Java
Kotlin
YourApplication.java
private void initLynxService() {
  // ...
  // register DevTool service
  LynxServiceCenter.inst().registerService(LynxDevToolService.INSTANCE);
}

打开 DevTool

DevTool 提供了一些调试功能开关, 其中有三个比较重要的开关:

  • Lynx Debug 是 DevTool 的总开关,其控制 DevTool 的所有调试功能。
  • Lynx DevTool 控制 DevTool 的基础调试功能:元件审查和 JavaScript 调试。
  • Lynx LogBox 控制 LogBox 功能。
这三个开关默认是关闭的,建议同步开启这三个开关
  • 使用 DevTool 桌面应用调试 Lynx 页面时,需要同时打开 Lynx Debug 和 Lynx DevTool 开关
  • LogBox 可以帮助你快速发现问题

你可以在初始化 LynxEnv 时打开设置这三个开关:

Java
Kotlin
YourApplication.java
private void initLynxEnv() {
  LynxEnv.inst().init(this, null, null, null);
  // 打开 Lynx Debug 开关
  LynxEnv.inst().enableLynxDebug(true);
  // 打开 Lynx DevTool 开关
  LynxEnv.inst().enableDevtool(true);
  // 打开 Lynx LogBox 开关
  LynxEnv.inst().enableLogBox(true);
}
INFO

除了前面介绍的三个开关外,还有更多可以帮助你控制 DevTool 的行为,请参考 DevTool 开关页面

恭喜你! 至此你已经完成了 DevTool 的接入。打开 Lynx DevTool 桌面应用, 使用 USB 线连接 app,即可开始调试。

Lynx DevTool 接入成功

下一步

除非另有说明,本项目采用知识共享署名 4.0 国际许可协议进行许可,代码示例采用 Apache License 2.0 许可协议进行许可。