SOURCE

        // 0.如果使用模块化编程，导入Vue和VueRouter,要调用Vue.use(VueRouter)
				
        // 1.定义路由组件
        // 可以从其他文件 import 过来
        const Register = { template: '<div>register</div>'};
        const Login = { template: '<div>login</div>'};

        // 2.定义路由
        // 每个路由应该映射一个组件。其中'component'可以是
        // 通过 Vue.extend()创建的构造器，
        // 或者，只是一个组件配置对象
        // 我们晚点再讨论嵌套路由
        const routes = [
            {path:'/register',component:Register},
            {path:'/login',component:Login}
        ]

        // 3.创建 router 实例，然后'routes'配置
        // 你还可以传递别的配置参数，不过先这么简单着吧
        const router = new VueRouter({
            routes //(缩写)相当于 routes:routes
        })
				

        // 4.创建和挂载根实例
        // 记得要通过 router 配置参数注入路由
        // 从而让整个应用都有路由功能
        const app = new Vue({
            router
        }).$mount('#app')
   

<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>
<div id="app">
        <h1>Hello App!</h1>
        <p>
            <!--通过 router-link 组件导航-->
            <!--通过 `to` 属性指定链接-->
            <!-- <router-link>默认会渲染一个 'a'标签 -->

            <router-link to='/register'>Go to register</router-link>
            <router-link to='/login'>Go to login</router-link>
        </p>
        <!-- 路由出口 -->
        <!-- 路由匹配到的组件将渲染在这里 -->
        <router-view></router-view>
    </div>