-
-
Notifications
You must be signed in to change notification settings - Fork 687
Add example for rendering subprocess output #406
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add example for rendering subprocess output #406
Conversation
2c7f90f
to
c54bc87
Compare
c54bc87
to
e25be08
Compare
@@ -0,0 +1,25 @@ | |||
'use strict'; | |||
const React = require('react'); | |||
const {render, Text, Box} = require('../../build'); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You don't have to explicitly include build
folder, because it's already set as the main
folder in package.json
.
const {render, Text, Box} = require('../../build'); | |
const {render, Text, Box} = require('../..'); |
const subProcess = childProcess.spawn('ping', ['8.8.8.8']).stdout; | ||
|
||
subProcess.on('data', newOutput => { | ||
setOutput(newOutput.toString('ascii')); | ||
}); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
To keep it explicit, because stdout
is not an instance of the process, so subProcess
wouldn't be a right name for it.
const subProcess = childProcess.spawn('ping', ['8.8.8.8']).stdout; | |
subProcess.on('data', newOutput => { | |
setOutput(newOutput.toString('ascii')); | |
}); | |
const subProcess = childProcess.spawn('ping', ['8.8.8.8']); | |
subProcess.stdout.on('data', newOutput => { | |
setOutput(newOutput.toString('ascii')); | |
}); |
|
||
return ( | ||
<Box flexDirection="column"> | ||
<Text>My ping output:</Text> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
<Text>My ping output:</Text> | |
<Text>My <Text bold>ping</Text> command output:</Text> |
return ( | ||
<Box flexDirection="column"> | ||
<Text>My ping output:</Text> | ||
<Text>{output}</Text> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
To give it a little more breathing room. It's also probably a good idea to limit the number of lines you can print, to ensure it doesn't fill up the entire terminal window.
<Text>{output}</Text> | |
<Box marginTop={1}> | |
<Text>{output}</Text> | |
</Box> |
}, [setOutput]); | ||
|
||
return ( | ||
<Box flexDirection="column"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
To give the whole UI more space.
<Box flexDirection="column"> | |
<Box flexDirection="column" padding={1}> |
Thanks! |
No description provided.