Expo + React Navigation + Vercel: Deep Linking not working

Question

I am using expo sdk41, react navigation 5, and vercel to deploy a web-build, built with expo build:web.

When I am developing locally, I can deep link, e.g. http://localhost:19006/sign-in. However when I deploy it to vercel and assign a domain name to it, the deep linking does not work anymore.

I am already doing the following, which allows deep linking to work in development:

export const linking = {
    prefixes: [Linking.createUrl('/'),
    screens: {
        ...
    }
}

Why is deep linking working in development and not when deployed to vercel?

I am happy to add more info if needs be.

Answer 1

Running expo build:web bundles a SPA and you need to redirect calls to the deployed app to index.html. Vercel allows configuring redirects using a vercel.json configuration file, placed at the root of a project.

Add a web/ folder in your Expo root directory and create a vercel.json file in the web/ folder with the following content:

{
  "rewrites": [{ "source": "/(.*)", "destination": "/index.html" }]
}

This file will be copied to the web-build folder when you run expo build:web.

Answer 2

I was able to fix this by setting the framework in the setting to create-react-app