0

i always deploy my projects on github pages, but this time for some reason it's not working properly. It only shows up the Navbar. I think it have to do with how i'm using react router. My app.tsx looks like this

<ChakraProvider>
      <Router>
        <Navbar />
        <Routes>
          {isAuth ? (
            <>
              <Route path="/profile" element={<Profile />} />
              <Route path="/user-chats" element={<UserChats />} />
              <Route path="/chat" element={<ChatPage />} />
              <Route path="/new-group" element={<NewGroup />} />
              <Route path="/group-chat" element={<GroupChat />} />
              <Route path="/group-config" element={<GroupConfig />} />
              <Route path="/friends" element={<FriendList />} />
              <Route path="/add-friend" element={<AddFriend />} />
            </>
          ) : (
            <>
              <Route path="/" element={<Login />} />
              <Route path="/create-account" element={<CreateAccount />} />
              <Route path="/phone-account" element={<PhoneAccount />} />
            </>
          )}
        </Routes>
        {isAuth && <BottomNav />}
      </Router>
    </ChakraProvider>

isAuth it's a state for it's authenticaded or not. If it's false then it will render the login page. In my package.json i added the homepage as

"homepage": "https://JosephKorel.github.io/FlyChat"

And at the scripts:

  "predeploy":"npm run build",
    "deploy":"gh-pages -d build"

Here is the website url https://josephkorel.github.io/FlyChat/ And here is the repo https://github.com/JosephKorel/FlyChat

José Carlos
  • 626
  • 3
  • 23
  • It looks like there's an issue finding an icon based on what the console says: `Error while trying to use the following icon from the Manifest: https://josephkorel.github.io/FlyChat/logo192.png (Download error or resource isn't a valid image)` – Jlove Jun 08 '22 at 12:43
  • I don't see any `"homepage"` entry in the `package.json` file, and I see you are using a `BrowserRouter`. Does this help answer your question? https://stackoverflow.com/a/71985764/8690857 – Drew Reese Jun 08 '22 at 15:08
  • Additionally, you might find the routing code works better for you if you implement protected route components instead of conditionally rendering different sets of route. See [how to create a protected route](https://stackoverflow.com/a/66289280/8690857) for examples. – Drew Reese Jun 08 '22 at 15:22
  • About the homepage at the package.json, i realized now i forgot to commit it to the main branch. Don't know if that's the issue. I'll check the thread you sent, thanks! @Jlove Have no idea what's that icon, but i'll check it too. Thanks – José Carlos Jun 08 '22 at 15:54
  • 1
    @DrewReese I used the hash router and it worked! Thanks – José Carlos Jun 08 '22 at 17:16

0 Answers0