title: Vue-Router returns "Cannot redefine property: $router" error
body: <p>im creating a small site using vue.js, im trying to setup a vue-router(which hasn't worked at all so far). im getting the "Cannot redefine property: $router" error.
  here is my code.
  App.Vue</p>
  
  <pre><code>&lt;div id="app"&gt;
  &lt;div class="header"&gt;
    &lt;div class="tab"&gt;
      &lt;router-link to="/page1"&gt;page1&lt;/router-link&gt;
    &lt;/div&gt;
    &lt;div class="tab"&gt;
      &lt;router-link to="/page2"&gt;page2&lt;/router-link&gt;
    &lt;/div&gt;
    &lt;div class="tab"&gt;
      &lt;router-link to="/page3"&gt;page3&lt;/router-link&gt;
    &lt;/div&gt;
    &lt;div class="tab"&gt;
      &lt;router-link to="/page4"&gt;page4&lt;/router-link&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;router-view&gt;&lt;/router-view&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Page1.vue</p>
  
  <pre><code> &lt;template&gt;
      &lt;div&gt;
          &lt;h3&gt;sup&lt;/h3&gt;
      &lt;/div&gt;
    &lt;/template&gt;
    &lt;script&gt;
      export default {
        name: 'app',
        data () {
          return {
            msg: 'hello world'
          }
        }
      }
    &lt;/script&gt;
    &lt;style&gt;
  
    &lt;/style&gt;
  </code></pre>
  
  <p>main.js</p>
  
  <pre><code>import Vue from 'vue'
  import App from './App.vue'
  import VueRouter from 'vue-router'
  Vue.use(VueRouter)
  new Vue({
    el: '#app',
    render: h =&gt; h(App)
  })
  const Page1 = { template: '&lt;div&gt;Page1&lt;/div&gt;' }
  const Page2 = { template: '&lt;div&gt;Page2&lt;/div&gt;' }
  
  const routes = [
    { path: '/page1', component: Page1 },
    { path: '/page2', component: Page1 }
  ]
  
  const router = new VueRouter({
    routes // short for `routes: routes`
  })
  
  const app = new Vue({
    router
  }).$mount('#app')
  </code></pre>
  
  <p>index.html</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;script src="https://unpkg.com/vue/dist/vue.js"&gt;&lt;/script&gt;
  &lt;script src="https://unpkg.com/vue-router/dist/vue-router.js"&gt;&lt;/script&gt;
  &lt;html lang="en"&gt;
    &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;title&gt;hello-world&lt;/title&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;div id="app"&gt;&lt;/div&gt;
      &lt;script src="/dist/build.js"&gt;&lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>ive worked with vue-router before and ran into this problem. i feel like im missing something but i dont know what, any help will be greatly appreciated </p>