Remote debugging for Horizon with Redux DevTools extension and remotedev.
- from Chrome Web Store
- or build it with
npm i & npm run build:extension
and load the extension's folder./build/extension
- or run it in dev mode with
npm i & npm start
and load the extension's folder./dev
.
- from AMO
- or build it with
npm i & npm run build:firefox
and load the extension's folder./build/firefox
.
- just specify
REDUX_DEVTOOLS
inelectron-devtools-installer
.
- Use remotedev.io or if you have the extension select
Remote DevTools
from the context menu. Just specifyremote
parameter, and optionallyhostname
andport
. See the API for details.
npm install --save horizon-remotedev
<script src="https://unpkg.com/horizon-remotedev/dist/horizon-remotedev.js"></script>
// import hzRemotedev from 'horizon-remotedev';
// or import hzRemotedev from 'horizon-remotedev/lib/dev'
// in case you want to use it in production or don't have process.env.NODE_ENV === 'development'
//Setup Horizon connection
const horizon = Horizon();
// ...
// Specify the horizon instance to monitor
hzRemotedev(horizon("react_messages"))
See chat example.
- arguments
- store object - horizon instance. Example:
horizon("react_messages")
. - config object (optional as the parameters bellow)
- name string - the instance name to be showed on the monitor page. Default value is table title.
- remote boolean - set it to
true
to have remote monitoring via the local orremotedev.io
server. - hostname string - use to specify host for
remotedev-server
. Ifport
is specified, default value islocalhost
. - port number - use to specify host's port for
remotedev-server
.
- store object - horizon instance. Example:
Also see the extension API and my presentation at React Europe.
By default use
import remotedev from 'horizon-remotedev';
It will work only when process.env.NODE_ENV === 'development'
, otherwise the code will be stripped.
In case you want to use it in production or cannot set process.env.NODE_ENV
, use
import remotedev from 'horizon-remotedev/lib/dev';
So, the code will not be stripped from production bundle and you can use the extension even in production. It wouldn't affect the performance for end-users who don't have the extension installed.
If you like this, follow @mdiordiev on twitter.