reduxjs/redux-devtools
1
1
Fork 0
mirror of https://github.com/reduxjs/redux-devtools.git synced 2024-11-10 19:56:54 +03:00
Code Issues Packages Projects Releases Wiki Activity

Rename remotedev-server to redux-devtools-cli

Browse Source
This commit is contained in:
Zalmoxisus 2019-01-04 00:58:29 +02:00
parent 4849081263
commit 7ef6812ee4
7 changed files with 66 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

78
packages/redux-devtools-cli/README.md
View File

@ -1,42 +1,64 @@
RemoteDev Server
================
Redux DevTools Command Line Interface
=====================================
Bridge for communicating with an application remotely via [Redux DevTools extension](https://github.com/zalmoxisus/redux-devtools-extension), [Remote Redux DevTools](https://github.com/zalmoxisus/remote-redux-devtools) or [RemoteDev](https://github.com/zalmoxisus/remotedev). Running your server is optional, you can use [remotedev.io](https://remotedev.io) instead.
### Installation
```
npm install --save-dev remotedev-server
```
Also [there's a docker image](https://github.com/jhen0409/docker-remotedev-server) you can use.
### Usage
##### Add in your app's `package.json`:
#### Install the package globally
with npm:
```
npm install -g redux-devtools-cli
```
or with yarn:
```
yarn global add redux-devtools-cli
```
and start as:
```
redux-devtools --hostname=localhost --port=8000
```
> Note the package is called `redux-devtools-cli` not `redux-devtools` (the latter is a React component).
#### Or add in your project
with npm:
```
npm install --save-dev redux-devtools-cli
```
or with yarn:
```
yarn add --dev redux-devtools-cli
```
and add to `package.json`:
```
"scripts": {
"remotedev": "remotedev --hostname=localhost --port=8000"
"redux-devtools": "redux-devtools --hostname=localhost --port=8000"
}
```
So, you can start remotedev server by running `npm run remotedev`.
So, you can start redux-devtools server by running `npm run redux-devtools`.
##### Import in your `server.js` script you use for starting a development server:
```js
var remotedev = require('remotedev-server');
remotedev({ hostname: 'localhost', port: 8000 });
var reduxDevTools = require('redux-devtools-cli');
reduxDevTools({ hostname: 'localhost', port: 8000 });
```
So, you can start remotedev server together with your dev server.
##### Install the package globally (not recommended) just run:
```
remotedev --hostname=localhost --port=8000
```
So, you can start redux-devtools server together with your dev server.
### Connection settings
@ -55,7 +77,7 @@ To use WSS, set `protocol` argument to `https` and provide `key`, `cert` and `pa
| `--key` | the key file for [running an https server](https://github.com/SocketCluster/socketcluster#using-over-https) (`--protocol` must be set to 'https') | - |
| `--cert` | the cert file for [running an https server](https://github.com/SocketCluster/socketcluster#using-over-https) (`--protocol` must be set to 'https') | - |
| `--passphrase` | the key passphrase for [running an https server](https://github.com/SocketCluster/socketcluster#using-over-https) (`--protocol` must be set to 'https') | - |
| `--dbOptions` | database configuration, can be whether an object or a path (string) to json configuration file (by default it uses our `./defaultDbOptions.json` file. Set `migrate` key to `true` to use our migrations file. [More details bellow](https://github.com/zalmoxisus/remotedev-server#save-reports-and-logs). | - |
| `--dbOptions` | database configuration, can be whether an object or a path (string) to json configuration file (by default it uses our `./defaultDbOptions.json` file. Set `migrate` key to `true` to use our migrations file. [More details bellow](#save-reports-and-logs). | - |
| `--logLevel` | the socket server log level - 0=none, 1=error, 2=warn, 3=info | 3 |
| `--wsEngine` | the socket server web socket engine - ws or uws (sc-uws) | ws |
@ -65,13 +87,13 @@ To use WSS, set `protocol` argument to `https` and provide `key`, `cert` and `pa
```
"scripts": {
"remotedev": "remotedev --hostname=localhost --port=8000 --injectserver=reactnative"
"redux-devtools": "redux-devtools --hostname=localhost --port=8000 --injectserver=reactnative"
}
```
The `injectserver` value can be `reactnative` or `macos` ([react-native-macos](https://github.com/ptmt/react-native-macos)), it used `reactnative` by default.
Then, we can start React Native server and RemoteDev server with one command (`npm start`).
Then, we can start React Native server and Redux DevTools server with one command (`npm start`).
##### Revert the injection
@ -79,11 +101,11 @@ Add in your React Native app's `package.json`:
```
"scripts": {
"remotedev-revert": "remotedev --revert=reactnative"
"redux-devtools-revert": "redux-devtools --revert=reactnative"
}
```
Or just run `$(npm bin)/remotedev --revert`.
Or just run `$(npm bin)/redux-devtools --revert`.
### Connect from Android device or emulator
@ -101,7 +123,7 @@ If you're still use Android 4.0, you should use `10.0.2.2` (Genymotion: `10.0.3.
You can store reports via [`redux-remotedev`](https://github.com/zalmoxisus/redux-remotedev) and get them replicated with [Redux DevTools extension](https://github.com/zalmoxisus/redux-devtools-extension) or [Remote Redux DevTools](https://github.com/zalmoxisus/remote-redux-devtools). You can get action history right in the extension just by clicking the link from a report. Open `http://localhost:8000/graphiql` (assuming you're using `localhost` as host and `8000`) to explore in GraphQL. Reports are posted to `http://localhost:8000/`. See examples in [tests](https://github.com/zalmoxisus/remotedev-server/blob/937cfa1f0ac9dc12ebf7068eeaa8b03022ec33bc/test/integration.spec.js#L110-L165).
Remotedev server is database agnostic using `knex` schema. By default everything is stored in the memory using sqlite database. See [`defaultDbOptions.json`](https://github.com/zalmoxisus/remotedev-server/blob/master/defaultDbOptions.json) for example of sqlite. You can replace `"connection": { "filename": ":memory:" },` with your file name (instead of `:memory:`) to persist teh database. Here's an example for PostgreSQL:
Redux DevTools server is database agnostic using `knex` schema. By default everything is stored in the memory using sqlite database. See [`defaultDbOptions.json`](https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-cli/defaultDbOptions.json) for example of sqlite. You can replace `"connection": { "filename": ":memory:" },` with your file name (instead of `:memory:`) to persist teh database. Here's an example for PostgreSQL:
```
{
"client": "pg",

2
packages/redux-devtools-cli/bin/injectServer.js
View File

@ -2,7 +2,7 @@ var fs = require('fs');
var path = require('path');
var semver = require('semver');
var name = 'remotedev-server';
var name = 'redux-devtools-cli';
var startFlag = '/* ' + name + ' start */';
var endFlag = '/* ' + name + ' end */';
var serverFlags = {

4
packages/redux-devtools-cli/bin/remotedev.js → packages/redux-devtools-cli/bin/redux-devtools.js
View File

@ -54,7 +54,7 @@ function getModule(type) {
if (argv.revert) {
var module = getModule(argv.revert);
var pass = injectServer.revert(module.path, module.name);
var msg = 'Revert injection of RemoteDev server from React Native local server';
var msg = 'Revert injection of ReduxDevTools server from React Native local server';
log(pass, msg + (!pass ? ', the file `' + path.join(module.name, injectServer.fullPath) + '` not found.' : '.'));
process.exit(pass ? 0 : 1);
@ -64,7 +64,7 @@ if (argv.injectserver) {
var options = getOptions(argv);
var module = getModule(argv.injectserver);
var pass = injectServer.inject(module.path, options, module.name);
var msg = 'Inject RemoteDev server into React Native local server';
var msg = 'Inject ReduxDevTools server into React Native local server';
log(pass, msg + (pass ? '.' : ', the file `' + path.join(module.name, injectServer.fullPath) + '` not found.'));
process.exit(pass ? 0 : 1);

4
packages/redux-devtools-cli/index.js
View File

@ -25,12 +25,12 @@ module.exports = function(argv) {
}
if (port !== p) {
if (logLevel >= LOG_LEVEL_WARN) {
console.log('[RemoteDev] Server port ' + port + ' is already used.');
console.log('[ReduxDevTools] Server port ' + port + ' is already used.');
}
resolve({ portAlreadyUsed: true, on: function(status, cb) { cb(); } });
} else {
if (logLevel >= LOG_LEVEL_INFO) {
console.log('[RemoteDev] Start server...');
console.log('[ReduxDevTools] Start server...');
console.log('-'.repeat(80) + '\n');
}
resolve(new SocketCluster(options));

20
packages/redux-devtools-cli/package.json
View File

@ -1,10 +1,10 @@
{
"name": "remotedev-server",
"version": "0.3.1",
"description": "Run the RemoteDev monitor on your local server.",
"name": "redux-devtools-cli",
"version": "1.0.0-1",
"description": "Run the ReduxDevTools monitor on your local server.",
"main": "index.js",
"bin": {
"remotedev": "bin/remotedev.js"
"redux-devtools": "bin/redux-devtools.js"
},
"files": [
"bin",
@ -16,25 +16,21 @@
"scripts": {
"test": "NODE_ENV=test mocha --recursive",
"test:watch": "NODE_ENV=test mocha --recursive --watch",
"prepublish": "npm run test"
"prepublishOnly": "npm run test"
},
"repository": {
"type": "git",
"url": "https://github.com/zalmoxisus/remotedev-server.git"
"url": "https://github.com/reduxjs/redux-devtools.git"
},
"keywords": [
"devtools",
"remotedev"
],
"engines": {
"node": ">=6.0.0"
},
"author": "Mihail Diordiev <zalmoxisus@gmail.com> (https://github.com/zalmoxisus)",
"license": "MIT",
"bugs": {
"url": "https://github.com/zalmoxisus/remotedev-server/issues"
"url": "https://github.com/reduxjs/redux-devtools/issues"
},
"homepage": "https://github.com/zalmoxisus/remotedev-server",
"homepage": "https://github.com/reduxjs/redux-devtools",
"dependencies": {
"body-parser": "^1.15.0",
"chalk": "^1.1.3",

5
packages/redux-devtools-cli/test/integration.spec.js
View File

@ -2,13 +2,12 @@ var childProcess = require('child_process');
var request = require('supertest');
var expect = require('expect');
var scClient = require('socketcluster-client');
var remotedev = require('../');
describe('Server', function() {
var scServer;
this.timeout(5000);
before(function(done) {
scServer = childProcess.fork(__dirname + '/../bin/remotedev.js');
scServer = childProcess.fork(__dirname + '/../bin/redux-devtools.js');
setTimeout(done, 2000);
});
@ -25,7 +24,7 @@ describe('Server', function() {
.expect('Content-Type', /text\/html/)
.expect(200)
.then(function(res) {
expect(res.text).toMatch(/<title>RemoteDev<\/title>/);
expect(res.text).toMatch(/<title>Redux DevTools<\/title>/);
})
});

2
packages/redux-devtools-cli/views/index.ejs
View File

@ -2,7 +2,7 @@
<html>
<head>
<meta charset="utf-8" />
<title>RemoteDev</title>
<title>Redux DevTools</title>
<style>
html {
min-width: 350px;