I'm trying to run multiple React SPA apps using ASP.NET Core 3.1 with the lastest SpaServices extension and have a problem serving static assets. Much of what I've built comes from a similar question at: How to configure ASP.net Core server routing for multiple SPAs hosted with SpaServices but that was related to Angular and an older version of SpaServices.
My code has two React apps, ClientApp and AdminApp and I have configured each using the following startup code:
app.Map("/client", clientApp =>{ clientApp.UseSpa(spa => { spa.Options.SourcePath = "ClientApp"; if (env.IsDevelopment()) { spa.UseReactDevelopmentServer(npmScript: "start"); } });});app.Map("/admin", adminApp =>{ adminApp.UseSpa(spa => { spa.Options.SourcePath = "AdminApp"; if (env.IsDevelopment()) { spa.UseReactDevelopmentServer(npmScript: "start"); } });});Going to the /client and /admin routes serves the correct React index.html file, but the linked bundled .js files do not load. Here's an example of the final index HTML for the ClientApp SPA:
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><base href="/client" /><title>Client App</title></head><body><h1>Client App</h1><div id="root"></div><script src="/static/js/bundle.js"></script><script src="/static/js/0.chunk.js"></script><script src="/static/js/main.chunk.js"></script></body></html>The problem is that the links are relative to the root of the site /static/js/bundle.js and need to be relative to the React app's path. The example file paths should be /client/static/js/bundle.js and /admin/static/js/bundle.js, respectively.
How do I get the system that writes the paths into the index.html file to use the correct root path for the static files? Thanks.