Problem to build links and export project for cpanel

[mojtabahub]

Hi, Many thanks for your awesome plugin,

Fortunately, I installed your plugin on expo-nextjs project successfully, i also tested your example codes on my blank project. I built android app, ios app and it work successfully , also i published my project on vercel for test it work successfully too. but when i use command "yarn export" for build project i have problem

when i upload built files (your example) on cpanel in this URL(http://test.mahanalborz.com/out/) "Click me to open profile :)" link doesn't work. its target is: http://test.mahanalborz.com/Profile and when i manually go to http://test.mahanalborz.com/out/Profile.html and i click on "👈 Go back " Button it doesn't work and nothing happen

what's problem? how can fix that? if you need i can send my test project for you

thanks

[nandorojo]

Is there something in particular that makes you think this library is causing the problem? Doesn't seem related given that it's working elsewhere.

If you could post the sample code that would be great. More details too, like a minimal repo, what version you're on, which react navigation, etc, thanks!

[nandorojo]

I see the problem. You need to change the route from /Profile to /out/Profile.

[mojtabahub]

Is there something in particular that makes you think this library is causing the problem? Doesn't seem related given that it's working elsewhere.

If you could post the sample code that would be great. More details too, like a minimal repo, what version you're on, which react navigation, etc, thanks!

Hello, thanks for your response.

expo version: 3.22.3 react-native version : 0.62.2 react-navigation version: 4.4.0 next.js version: 9.4.4

i just used your example project codes in this test project. if there is need i sent the codes. I'll sent it for you in next comment.

I see the problem. You need to change the route from /Profile to /out/Profile

As you said me, I did change the path from /Profile to /out/Profile but it doesn't work on android.

is there any way to solve that?

Many thanks

[mojtabahub]

App.js file in root folder

// Use next.js page for the mobile app
//export { default } from './pages'

import React from 'react'
import { View, Text, StyleSheet } from 'react-native'
import { createAppContainer } from 'react-navigation'
import { createStackNavigator } from 'react-navigation-stack'
import { Link, useRouting } from 'expo-next-react-navigation'

// See the pages/folder for the next.js routes
// everything else is confined in this file :)

export function Home() {
  return (
    <View style={styles.container}>
      <Text style={styles.text}>Home Screen my home 🥳</Text>
      <Link style={{ color: 'green', fontSize: 20 }} routeName="Profile">
        Click me to open profile :)
      </Link>
    </View>
  )
}

export function Profile() {
  const { goBack } = useRouting()

  return (
    <View style={styles.container}>
      <Text style={styles.text}>Profile! my profile 🏋️‍♀️</Text>
      <Button text="👈 Go back" onPress={() => goBack()} />
    </View>
  )
}

const AppNavigator = createStackNavigator({
  'gg': Home,
  Profile,
})

export default createAppContainer(AppNavigator)

/**
 *
 *
 *
 *
 *
 *
 * styles, button, etc
 */

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
  },
  text: {
    fontSize: 20,
    margin: 20,
  },
})

function Button({ text, onPress }: { text: string; onPress?: () => void }) {
  return (
    <Text
      style={{
        paddingHorizontal: 20,
        paddingVertical: 10,
        backgroundColor: 'black',
        color: 'white',
        margin: 20,
      }}
      onPress={onPress}
    >
      {text}
    </Text>
  )
}

Profile.js file in root/pages folder

export { Profile as default } from '../App'

index.js file in root/pages folder

export { Home as default } from '../App'

[nandorojo]

The solution is in the docs. In Link, add <Link routeName="Profile" web={{ path: '/out/Profile' }} />

[mojtabahub]

Many thanks for your solution. It's working :)

There is one problem. as you can see in this link(http://test.mahanalborz.com/out/Profile.html) when i click on "👈 Go back " button, it doesn't work and nothing happened. is there because it's a button?

<Button text="👈 Go back" onPress={() => goBack()} />

also as i said it work on android and ios truly