Deploy React PWA to Tomcat Subfolder

Ionic Framework Ionic React
1

I’m trying to deploy my Ionic React PWA to a subfolder on Tomcat.

I just run ionic build --prod and then copy the content of the build folder to my Tomcat subfolder.

The issue seems to be that the content still think it’s served from root of my domain ie https://example.com and not https://example.com/app/ where it really is located.

I have also tested changing the <base href="/" /> to both href="/app/" and href="https://example.com/app/" with no luck.

Any ideas really appreciated.

2

Any luck on this? I’m having the same issue, and haven’t found a solution. You’d think this would be accomplished simply with a single flag in the build command (ng supports it).

3

I’m not familiar with Tomcat, but I am running an Ionic React PWA on nginx with Drupal 9 in the root directory, and my Ionic app in /app.

I also deploy my Ionic app on iOS and android.

To get my routes to work on all three platforms, this is what I did:

  1. Created variables for all my route paths, for example:
          <Route exact path={routeContact}>
            <PageContact />
          </Route>
  1. Defined all my route variables in a routes.tsx:
export const appBasePath = '/app/';

export const routeContact = `${appBasePath}contact`;

This is obviously not as clean as a build flag but it works, and it ensures that mobile apps and the PWA are all reporting the same URLs to Firebase Analytics.