App Proxy Routing Conflicts with Remix when Multiple App Instances are Installed

[gugaiz]

I have reproduced the issue on the latest CLI version.

Yes, I am on the latest version

I have searched existing posts and this report is not a duplicate.

Yes, this isn’t a duplicate

In which of these areas are you experiencing a problem?

App

Expected behavior

Issue Summary

When multiple Shopify apps with app proxy configurations are installed on the same development store, Shopify automatically appends instance suffixes (-2, -3, etc.) to app proxy paths. This breaks Remix applications that use file-based routing, as the client-side router cannot match routes with unexpected suffixes.

Expected Behavior

When developing a Shopify app with app proxy configuration using Remix:

• App proxy should work seamlessly regardless of how many similar apps are installed on the store
• Remix routing should function normally with both server-side and client-side rendering
• Developers should be able to test their app instance without routing errors

Why Development on Shared Stores is Necessary

In many real-world scenarios, developers must test on stores that already have multiple apps installed because:

1. No Store Cloning Capability: Shopify does not provide a way to clone stores with all their data and configuration
2. Complex App Dependencies: Apps often depend on multiple other apps being installed and configured on the same store
3. Data Dependencies: Apps may rely on:
   • Existing products with specific configurations
   • Complex metafield structures
   • Metaobjects with relationships
   • Custom data that took significant time to set up
4. Time Constraints: Reproducing a production-like environment on a fresh dev store can take hours or even days

This makes it impractical to use a clean dev store for testing, forcing developers to work on stores where staging and development app instances coexist.

Actual behavior

When a second app with the same proxy configuration is installed:

• Shopify appends instance suffixes to the app proxy path (e.g., /a/sub becomes /a/sub-3)
• Browser shows URLs like https://store.myshopify.com/a/sub-3/my-account
• Shopify correctly strips the suffix before proxying to the app (server receives /a/sub/my-account)
• However, Remix client-side router sees /a/sub-3/my-account in window.location.pathname
• This path doesn’t match any routes defined in the app (which are based on /a/sub/*)
• Results in error: Route 'routes/$' does not match URL '/a/sub-3/my-account'
• React hydration fails, breaking all client-side interactivity

Reproduction steps

1. Create a Shopify Remix app with app proxy configuration:

[app_proxy]
url = "https://my-app.dev/a/sub"
subpath = "sub"
prefix = "a"

2. Create a Remix route file: app/routes/a.sub.my-account._index.tsx

3. Install the app on a development store

4. Create a second app with identical proxy configuration (or clone the first app)

5. Install the second app on the same store

6. Access the second app via the proxy path: https://store.myshopify.com/a/sub-3/my-account

Result: Console error and broken client-side functionality

Verbose output

not relevant

Operating system

Ubuntu 25.10

CLI version

@shopify/cli/3.89.0 linux-x64 node-v20.12.2

Shell

bash

Nodejs version

v20.12.2

What language and version are you using in your application?

Remix

[bkspace]

Ah, I have run into this in the past, but didn’t know what the root cause was!

The truth is though, that the merchant themselves can actually edit the proxy path themselves, so there’s no guarantee that /a/sub stays as it is:

Having said that, I’m not sure what the solution could be, other than just verifying the proxy URL hasn’t been edited in a ‘bug’ investigation (or how ever it arises!).

Point being, I think there is a bigger concept to fix here. Perhaps for the time being, it might be good to have a unique path for development vs production, and duplicate the route (abstract out the logic into a module).