Repository navigation
Proposal: run and watch scripts to use different entry points #218
Description
Activity
Yeah, I would normally use
babel-nodeandbabel-watchbut since the.babelrcisn't exposed in this project, there's no straightforward way to do it without ejecting. Thisrunandwatchfunctionality could mostly be simple wrappers aroundbabel-nodeandbabel-watch, with something to deal with the ES module support issue you bring up.@ForbesLindesay also suggested this in another thread. Seems like a useful feature.
I'm not sure I understand the use case for watch though, can you elaborate?
There's something a little weird about having a
populatescript to populate a backend in a front-end project. What are the actual use cases in an application for running one-off scripts? I don't think I have any outside of build-related tasks.@gaearon
watchis useful if you want to write a long-running process such as a server so that it automatically restarts during development. You could make a simple node server this way and have it reuse library code in yoursrcdirectory. It could be something that's a full backend, or it could also be something simple like a proxy that you're only going to use in development. For example you could have Flash content somewhere and want to write a proxy that served up.swffiles from a separate folder & used a separate deployment process.@taion Well build-related tasks are certainly one use case. You might run a script to update something that you've vendored, for example. If it's straightforward to add your own build-related scripts, then it will let people add features to their projects without needing support from the build tooling provided by
create-react-appitself. A script to populate a backend in a front-end project is something you might want if you are using a "serverless" design. For example, you might be using a Firebase backend, and your workflow might be to provision a new one and put some seed data in there whenever a new developer joins your team. With this sort ofreact-scripts runfunctionality you can write the seed-data script using helper libraries you've already written.My hope is, the more there are generic tools to let developers use the runtime environment that
create-react-appprovides, the more people will be able to build themselves rather than asking for more features to come "out of the box" or ejecting.An example where I would want
watchis the example at https://github.com/fullstackreact/create-react-app-with-server that @acco created. That project invokes its server with./node_modules/.bin/babel-nodeso you could use the proposedreact-scripts runto directly match its functionality but I thinkreact-scripts watchwould be better for that use case.OK I am going to take a stab at creating
run, and then depending on how that goes maybewatchwill also be useful.Reacted by dan and Ari PoradThis run and watch functionality could mostly be simple wrappers around babel-node and babel-watch, with something to deal with the ES module support issue you bring up.
What is the plan for dealing with ES modules? I don't necessarily see a way around it without creating a separate Babel config for this feature that keeps transpiling to CommonJS (which doesn't seem like a good idea), or bundling with Webpack instead of using babel-node.
I think it would make more sense to use webpack than babel-node, because then you'll be able to rely on the same loaders and plugins you're already using in the application code. It might be confusing for a user if they can't load some filetypes in some of their JS, but they can elsewhere.
I think it would make more sense to use webpack than babel-node
Agree.
Closing for now as doesn’t seem to catch on.
We're using a mono-repo and link local dependencies within the same repo for fast development. It's sometimes helpful to run watch on dependent module and develop on it while running it as a dependency. I think this would be a nice feature to have.
Reacted by Yuval Greenfield and Eli Shkurkin- locked and limited conversation to collaborators
on Jan 22, 2019
As I start to build out real apps I find cases where I want to run a one-off script using the same language features as the rest of my app. If the only way to enter my code is via
npm startthen there's no way to do this.The proposed solution is to add two more scripts,
react-scripts runandreact-scripts watchthat the developer can use to make their own npm script which uses the same babel environment. For example, let's say you had a scriptsrc/populate.jsto populate initial data in a remote backend. You could add to your npm scripts:and then when you ran
npm run populateit would invokesrc/populate.jsbut do all the babel preprocessing to let you use ES6 features.watchwould work just likerun, but when any file changed it would restart the process. Sowatchwould be used for long-running processes;runwould be used for one-off scripts.runhere works similarly torails runif you are familiar with rails.Without this sort of feature, developers are likely to make these one-off scripts using ES5 or using whatever language subset is node-compatible. This would also be a useful hook for people who wanted to build node server functionality, while not forcing it on anyone.
What do you think?