Package Exports
- react-devtools-core
- react-devtools-core/backend
- react-devtools-core/standalone
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-devtools-core) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
react-devtools-core
A standalone React DevTools implementation.
This is a low-level package. If you're looking for the Electron app you can run, use react-devtools
package instead.
API
react-devtools-core
This is similar requiring the react-devtools
package, but provides several configurable options. Unlike react-devtools
, requiring react-devtools-core
doesn't connect immediately but instead exports a function:
const { connectToDevTools } = require("react-devtools-core");
connectToDevTools(config);
Run connectToDevTools()
in the same context as React to set up a connection to DevTools.
Be sure to run this function before importing e.g. react
, react-dom
, react-native
.
The config
object may contain:
host: string
(defaults to "localhost") - Websocket will connect to this host.port: number
(defaults to8097
) - Websocket will connect to this port.useHttps: boolean
(defaults tofalse
) - Websocket should use a secure protocol (wss).websocket: Websocket
- Custom websocket to use. Overrideshost
andport
settings if provided.resolveRNStyle: (style: number) => ?Object
- Used by the React Native style plug-in.retryConnectionDelay: number
(defaults to2000
) - Milliseconds delay to wait between retrying a failed Websocket connection.isAppActive: () => boolean
- If provided, DevTools will poll this method and wait until it returns true before connecting to React.
react-devtools-core/standalone
Renders the DevTools interface into a DOM node.
require("react-devtools-core/standalone")
.setContentDOMNode(document.getElementById("container"))
.setStatusListener(status => {
// This callback is optional...
})
.startServer(port);
Renders DevTools interface into a DOM node over SSL using a custom host name (Default is localhost).
const host = 'dev.server.com';
const options = {
key: fs.readFileSync('test/fixtures/keys/agent2-key.pem'),
cert: fs.readFileSync('test/fixtures/keys/agent2-cert.pem')
};
require("react-devtools-core/standalone")
.setContentDOMNode(document.getElementById("container"))
.setStatusListener(status => {
// This callback is optional...
})
.startServer(port, host, options);
Reference the react-devtools
package for a complete integration example.
Development
Watch for changes made to the backend entry point and rebuild:
yarn start:backend
Watch for changes made to the standalone UI entry point and rebuild:
yarn start:standalone