cannot GET /pageName when using React Navigation on web project

user_1740008 0
Viewed 53

Browser page refreshes break my application.

I'm using react navigation in an expo universal application. When a user refreshed the browser on route "/", everything works as intended. When a user refreshed on any other route, e.g. "/search" I see this served:

Cannot GET /search

I have looked at deep linking

import * as Linking from 'expo-linking'
...
const prefix = Linking.createURL('/')

const linking={
  prefixes: [prefix],
  config: {
    screens: PathsByName,
  },
}

<NavigationContainer linking={linking}>
  ...
</NavigationContainer>

as well as a custom webpack

  config.devServer.historyApiFallback = {
    index: 'index.html'
  }

but I still cant get simple page refreshes to load properly.

react-navigation expo react-native
1 Answers

The problem was I customized the webpack config incorrectly.

This config works,

const createExpoWebpackConfigAsync = require('@expo/webpack-config')

module.exports = async function (env, argv) {
  const config = await createExpoWebpackConfigAsync(env, argv)

  // avoid improper settings here

  return config
}
user_17400080
Related