For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt, and this page is available as Markdown at /docs/rozenite-for-lynx.md.

Rozenite for Lynx

Experimental

Rozenite for Lynx is experimental. It has been verified against LynxExplorer on the iOS Simulator, the Android emulator, and a physical Android phone over USB. A physical iPhone should work the same way, over DebugRouter's usbmux transport, but that path hasn't been tested yet. It has not been verified across the full range of LynxSDK versions, and the API may change in future releases.

Rozenite for Lynx lets you debug a Lynx app with the same DevTools panels, the same plugin catalogue and the same rozenite CLI you use for React Native.

You need three things: @rozenite/lynx-dev in your dev server, @rozenite/lynx in your app, and Lynx DevTool turned on in the app itself — that last one is off by default and nothing works without it. Start there.

Turn on Lynx DevTool

Lynx ships its DevTool component switched off. With it off, your app never registers a debuggable session, so Rozenite finds nothing to connect to and your target list stays empty.

In LynxExplorer, on Android and iOS alike, open the Settings tab → Lynx DevTool Switches, turn Lynx DevTool on, then quit and reopen the app. The switch only takes effect on a fresh launch. On Android the same page also has V8 engine and PrimJS toggles — leave those alone, Rozenite works either way.

In your own app, enable it where you initialise the Lynx environment — LynxEnv.inst().enableDevtool(true) on Android, devtoolEnabled = YES on iOS. On iOS you also need enableAllSessions on LynxServiceDevToolProtocol, or your cards won't be offered for debugging. Lynx's Integrate Lynx DevTool guide has the full setup for each platform.

Add @rozenite/lynx-dev to your dev server

Installation

npm
yarn
pnpm
bun
deno
npm install -D @rozenite/lynx-dev

Configuration

Add the plugin to your lynx.config.ts:

import { defineConfig } from '@lynx-js/rspeedy';
import { pluginReactLynx } from '@lynx-js/react-rsbuild-plugin';
import { rozeniteLynxPlugin } from '@rozenite/lynx-dev';

export default defineConfig({
  plugins: [pluginReactLynx(), rozeniteLynxPlugin()],
});

The plugin is inert in production builds. Pass enabled explicitly if you want to control that yourself.

Rozenite plugins are discovered from your project's package.json exactly as they are for React Native — install a plugin as a dependency and it shows up.

Add @rozenite/lynx to your app

Installation

npm
yarn
pnpm
bun
deno
npm install -D @rozenite/lynx

Entry point

Import it once, as early as possible in your app's entry point. It has to run before any plugin's useRozeniteDevToolsClient does.

if (__DEV__) {
  require('@rozenite/lynx');
}

It installs itself only in Lynx's background runtime and is a no-op everywhere else.

Open DevTools

  1. Connect your device over USB, or start your simulator, and open your app.
  2. Start the dev server and load your bundle in the app.
  3. The dev server prints a DevTools URL for every card it finds. Open the one for your card in a browser.

Each Lynx card is its own target, so you get one URL per card rather than one per app. In LynxExplorer that includes LynxExplorer's own home screen — pick the entry whose title is your bundle URL.

Pin discovery to one device

Rozenite finds Android phones and emulators over adb, physical iPhones over usbmux, and the iOS Simulator by scanning 127.0.0.1:8901-8919. All three are on by default, so the common cases need no configuration. Narrow it if you want:

rozeniteLynxPlugin({
  enableDesktop: false, // stop scanning localhost — the iOS Simulator disappears
  deviceSerial: 'ABC123', // only this device (an adb serial or a udid)
});

Note that enableDesktop is an iOS Simulator concern only. An Android emulator arrives over adb with its real emulator-5554 serial, so turning enableDesktop off doesn't hide it — turning enableAndroid off does.

Troubleshooting

Your target list is empty. Nine times out of ten, Lynx DevTool is off — see Turn on Lynx DevTool, and remember it needs an app restart. Otherwise: check the app is a development build, and that a card is actually open (an app sitting on a native screen has no cards to debug). On Android, adb devices should list the phone or emulator — if it doesn't, Rozenite can't see it either. On the iOS Simulator, check you haven't turned enableDesktop off.

Your card shows up but panels stay disconnected. The app is reachable but Rozenite isn't running inside it. Check @rozenite/lynx is imported at the entry point and that the import actually runs in your development build.

A panel connects but never receives anything. Most likely the plugin's device half is written against React Native APIs — see What doesn't work yet.

lynx.getDevtool is not a function. Your LynxSDK predates the devtool event channel. Upgrade it.

The card renders blank. Usually a bad bundle URL rather than anything to do with Rozenite. Check the scheme is lowercase http:// — some on-screen keyboards autocapitalise the first letter, and Lynx won't load Http://. On an Android emulator, use your machine's LAN address rather than localhost; localhost there is the emulator itself.

What doesn't work yet

  • Plugins whose device half is written against React Native APIs don't work on Lynx: network activity, storage, file system, performance monitor, require profiler and Expo Atlas. Plugins that only move state around do work — Redux DevTools, TanStack Query, React Hook Form, feature flags and controls.
  • Only apps DebugRouter can reach are discovered: Android over adb, physical iPhones over USB, and the iOS Simulator over localhost.

Need React or React Native expertise you can count on?