Create React App integrated in an existing application

If I have a react app nested in a server-side rendered page, how would I be able to get react to live-reload while in dev?

Right now, the server renders the page which has a DOM element the CRA app mounts to, to display within the application. It works great since we can’t stop to rewrite the entire application just yet, but we can’t get it to live-reload this way.

Basically my structure is

/app (server)
/public (css/js)
/ui (cra)
/views (server-side)

ui is all the react code, and it gets transpiled and pushed to the /public directory, where it then looks for div ids in /views to mount to. The server generates the page, loads the JS, and React starts running inside the rendered pages, wherever it mounts.

How can I run this app and have react hot-reload to /public for me?

Thanks!

Also, this would be nice to do without ejecting.

[sunnyw1212]

nope. still don’t have true live-reload, but i figure it’s still a better dev workflow than having to rebuild every time you want to see a change

[natdm]

Interesting. That works pretty well but doesn’t live-reload the component, just updates the JS. Do you have a way to do that?

On Fri, Mar 23, 2018 at 9:54 PM, qwertwerty21 [e-mail] wrote:

our work app has a similar structure to yours. i was messing around with it today and found out you can get live-reloading if you run npm start in the react app and have your server load localhost:3000/bundle.js instead of the final production version of bundle.js

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/facebook/create-react-app/issues/4133#issuecomment-375846959, or mute the thread https://github.com/notifications/unsubscribe-auth/AKwACQ0_FManpzUop8ipCigAHBnqiJlkks5thdGVgaJpZM4Sktuk .

–

---

Nathan Hyland [phone]