I'm wondering if there is an easy way to deploy an express server that serves different apps on different routes. (Not a front end and and api.) So, for instance let's say I wanted to run a "Hello World." app through a finite number of routes (like a home/landing page) and then deploy a "My app" app through a certain URL route with each react app using react router. Is this possible? If so, how can it be done?
1 Answer
U should provide homepage in package.json for each react-app,
for example
__
|_ app1/
|_ app2/
|_ server/
for app1 package.json homepage: "/app1"
for app2 package.json homepage: "/app2"
Express server code:
app.use("/app1", express.static(path.resolve(__dirname, "../app1/build")))
app.use("/app2", express.static(path.resolve(__dirname, "../app2/build")))
app.get("/app1", (_req, res) => {
res.sendFile(path.resolve(__dirname, "../app1/build/index.html"))
})
app.get("/app2", (_req, res) => {
res.sendFile(path.resolve(__dirname, "../app2/build/index.html"))
})
I hope I was able to help
Edit:
Also you can provide basename prop for BrowserRouter or HashRouter
For app1 basename="app1" and for app2 basename="app2"
6 Comments
Mr.Drew
Thanks for the answer but this doesn't appear to work. Just getting blank white screens returned.
Levaya Pochta
check urls for static react files
Mr.Drew
Okay, this method seems not to load the assets correctly. When I define one of the apps to the base route "/" it works for that app, but won't load the assests when defined as /app1 route. So if I change say the first argument "/app1" in the use/get functions to "/" the assets load correctly for that app. Same if I change "/app2" to "/", but they won't load as defined currently.
Mr.Drew
So I will accept this answer if you change the
app.use("/app1"...) and app.use("/app2"...) to app.use("/"...). It'd also be cool if I could figure out why I seem to have to do that. Any ideas?Levaya Pochta
if you provide
homepage in package.json, in index.html path will change from /static/js/2.e23c04ee.chunk.js ti /app1/static/js/2.e23c04ee.chunk.js |