Vue router subdirectory links not working (SPA)

The home page and the router link at the very top works so that I can switch between ‘Get Top Games’ and ‘Get Top Streamers’, but as soon as I try to click on an individual game or streamer, I get a page not found error. Is it something to do with Vue Routers? I need the subdirectories and the sent vue.js parameters to work for my Single Page Application to work fully properly.

My router index.js file in my Vue.js application has the following redirect codes. I’m noticing only the links with variable parameters are not working. Is that a possible cause and is there a specific fix to this?

const routes = [
  {
    path: '/',
    name: 'GetTopGames',
    component: GetTopGames
  },
  {
    path: '/GetTopStreamers',
    name: 'GetTopStreamers',
    component: GetTopStreamers
  },
  {
    path: '/streamer/:streamer_user_name',
    name: 'Streamer',
    component: Streamer
  },
  {
    path: '/StreamersForGame/:game_name',
    name: 'StreamersForGame',
    component: StreamersForGame,
  }
]

this stackoverflow answer fixed it for me - https://stackoverflow.com/questions/53336917/vuejs-routing-navigation-issues/53337147

1 Like