Running into issues with the router and using an external component for the nav

Full source here.

I am receiving the following error by having my navigation menu as an external component:

[Vue warn]: Failed to resolve directive: link (found in anonymous component - use the "name" option for better debugging messages.))

Now after a bit of googling I think it is related to this.

Which is something to do with the component being external.

App.vue:

<template>
  <div id="app">
    <div class="container">
      <navigation></navigation>
      <router-view></router-view>
    </div>
  </div>
</template>

<script>
import Navigation from './components/Navigation'

export default {
  components: {
    Navigation,
  }
}
</script>

Navigation.vue:

<template>
  <div class="navigation">
    <div class="grid -middle">
      <div class="cell -3of12">
        <h1>Otis Wright</h1>
      </div>
      <div class="cell -9of12">
        <ul class="menu">
          <li>
            <a v-link="{ path: 'home' }">Home</a>
          </li>
          <li>
            <a v-link="{ path: '/projects' }">Projects</a>
          </li>
          <li>
            <a href="#">Experiments</a>
          </li>
          <li>
            <a href="#">Contact</a>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

But after looking at the routes I can not figure out what is going wrong?

index.js:

import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)

export default new Router({
  mode: 'hash',
  routes: [
    {
      path: '/',
      component: require('../views/Home')
    },
    {
      path: '/projects',
      component: require('../views/Projects')
    }
  ]
})

Sorry still learning Vue and I am probably missing something really simple, the routes are being handled slightly differently to what I am used to so I can’t quite figure it out.

[egoist]

Oh, I misunderstand you.

There’s no v-link directive in vue-router 2

Using a component called <router-link> instead:

<router-link to="/">/</router-link>

[wanteed-lh]

@egoist i try this solution but dosn’t work with that my error [Vue warn]: Failed to resolve directive: link (found in anonymous component - use the “name” option for better debugging messages.)