Preact Devtools for ReactLynx

The Lynx Devtool Panel that allows you to inspect a ReactLynx component hierarchy, including props and state.

Usage

We need to import @lynx-js/preact-devtools somewhere to initialize the connection to Preact Devtools Panel. Make sure that this import is the first import in your whole app.

import '@lynx-js/preact-devtools'

See the documentation of Preact Devtools Panel in Lynx Devtool for more information.

Contributing

• ldt-plugin contains the source code of Preact Devtools Panel in Lynx Devtool. Run it by npm run dev:ldt-plugin when developing, and npm run build:ldt-plugin to build it.
• src contains the source code for ReactLynx App to setup Preact Devtools related hooks. You can build it just by npm run build:lib in the root folder of this repository.

The ReactLynx App will communicate with the Preact Devtools Panel in Lynx Devtool using CDP messages.

Credits

Thanks to:

• Preact Devtools for the original Devtools implementation for Preact.