Search code examples
vue.js

Pound sign on vue router links


Hi how can I remove the pound sign in the router links in vue. I always get a pound sign in every links for example: http://localhost:8080/#/

export default new Router({
  routes: [
    {
      path: '/',
      name: 'SplashScreen',
      component: SplashScreen
    },
    {
      path: '/aboutus',
      name: 'AboutUs',
      component: AboutUs
    },
    {
      path: '/aboutus',
      name: 'Dashboard',
      component: Dashboard
    }
  ]
})


Solution

  • use mode as history

     const router = new VueRouter({
       mode: 'history',
       routes: [...]
     })
    

    Also need server configuration Apache

    <IfModule mod_rewrite.c>
      RewriteEngine On
      RewriteBase /
      RewriteRule ^index\.html$ - [L]
      RewriteCond %{REQUEST_FILENAME} !-f
      RewriteCond %{REQUEST_FILENAME} !-d
      RewriteRule . /index.html [L]
    </IfModule>
    

    check more details here