安装并引用

安装

npm install vue-router

引用

步骤一:在src路径下,创建router文件夹, 其下创建index.js

// router/index.js
import Vue from 'vue'
import VueRouter from 'vue-router' // 1.安装插件
Vue.use(VueRouter) // 2.创建路由对象
const routes = [
{
path: '',
redirect: '/home'
},
{
path: '/home',
component: Home
},
] const router = new VueRouter({
routes,
mode: 'history'
}) // 3.导出router
export default router

步骤二: 在main.js中挂载路由

// main.js挂载路由
import Vue from 'vue'
import App from './App.vue'
import router from './router' Vue.config.productionTip = false new Vue({
render: h => h(App),
router
}).$mount('#app')

手动安装vur-router并引用的更多相关文章

  1. vue-devtools(vue 2.0)手动安装与使用 ? 如何处理Vue.js is detected on this page ?

    vue-devtools手动安装与使用   一.在github上下载压缩包,github下载地址:https://github.com/vuejs/vue-devtools 二.解压到本地的某盘 三. ...

  2. maven手动安装jar包到本地仓库,以ojdbc6为例

    在做mybatis generator的中文注释实现时,感觉每次都要在配置文件中指定ojdbc6的位置太麻烦了,别人用也不方便,没有的还得自己去下,所以就想直接把ojdbc6打包到项目里,这样拿到就可 ...

  3. windows服务的编写,手动安装与卸载

    windows服务的编写 1.要添加的引用 using System.ServiceProcess; using System.ServiceModel ; using WcfServiceLibra ...

  4. Ubuntu16手动安装OpenStack

    记录大佬的博客全文转载于https://www.voidking.com/dev-ubuntu16-manual-openstack-env/ 前言 <Ubuntu16安装OpenStack&g ...

  5. Yii2 手动安装yii2-imagine插件

    由于网络的原因使用composer安装Yii框架,实在太过痛苦,所以这里干脆就手动安装yii-imagine的扩展. 首先下载yii2-image和Imagine扩展库,点击链接就可以从百度云下载上传 ...

  6. 将Apache手动安装成Windows的服务

    将Apache手动安装成Windows的服务 可以选择在安装Apache时自动将其安装为一个服务.如果选择"for all users",那么Apache将会被安装为服务. 如果选 ...

  7. python 利用 setup.py 手动安装django_chartit

    手动安装django_chartit库 1 下载压缩包 2 解压到python安装目录下,文件夹名为django_chartit,并检查文件夹下是否有setup.py文件 3 在cmd中进入djang ...

  8. Mac下手动安装Chromedriver.exe

    Mac OS X Yosemite 10.10.4下,ChromeDriver运行异常,需要手动安装chromedriver.exe Step 1: 打开https://sites.google.co ...

  9. windows下手动安装和配置xamarin

    安装xamarin xamarin官方给出了两种安装方式,自动安装和手动安装. 自动安装比较简单,到http://xamarin.com/download下载xamarininstaller.exe ...

  10. Xamarin 手动安装步骤+破解(最新版Xamarin V3)

    Create native iOS, Android, Mac and Windows apps in C#. 看到这句话,你就知道Xamarin是什么了,对于C#开发者,这样的标语还是会让你激动一下 ...

随机推荐

  1. 关于在 springboot 中使用 @Autowired 注解来对 TemplateEngine 进行自动装配时,无法注入的问题。

    前言 本文是基于江南一点雨的 Spring Boot+Vue 系列视频教程第 三 章的第三节,详情参考Spring Boot+Vue系列视频教程 在观看学习这一节时,发现当进行手动渲染 Thymele ...

  2. 【Docker】Harbor 分布式仓库管理

    一.Harbor 介绍 Harbor 是 VMware 公司开源的企业级 Docker Registry 项目,其目标是帮助用户迅速搭建一个企业级的 Docker Registry (私有仓库)服务. ...

  3. ET中热更(ILRuntime)使用过程中,需要做的适配器,比如Linq排序

    ET中热更(ILRuntime)使用过程中,需要做的适配器,比如Linq排序 By Flamesky 最近项目中用到个Linq的排序,由于没有注册适配器,导致不能用,其实ILRT作者已经做得很好,报错 ...

  4. 联想win8改win7

    知识点分析:目前联想出厂预装Windows 8的台式和一体机使用都是UEFI+GPT硬盘的组合,并且开启了安全启动,但是目前除Window 8以外的其他Windows系统均不支持这种模式,因此如果需要 ...

  5. 一种KV存储的GC优化实践

    作者:vivo 互联网服务器团队- Yuan Jian Wei 从内部需求出发,我们基于TiKV设计了一款兼容Redis的KV存储.基于TiKV的数据存储机制,对于窗口数据的处理以及过期数据的GC问题 ...

  6. 2022-11-26:给定一个字符串s,只含有0~9这些字符 你可以使用来自s中的数字,目的是拼出一个最大的回文数 使用数字的个数,不能超过s里含有的个数 比如 : 39878,能拼出的最大回文数是

    2022-11-26:给定一个字符串s,只含有0~9这些字符 你可以使用来自s中的数字,目的是拼出一个最大的回文数 使用数字的个数,不能超过s里含有的个数 比如 : 39878,能拼出的最大回文数是 ...

  7. 2022-05-27:现在有N条鱼,每条鱼的体积为Ai,从左到右排列,数组arr给出。 每一轮,左边的大鱼一定会吃掉右边比自己小的第一条鱼, 并且每条鱼吃比自己小的鱼的事件是同时发生的。 返回多少轮之

    2022-05-27:现在有N条鱼,每条鱼的体积为Ai,从左到右排列,数组arr给出. 每一轮,左边的大鱼一定会吃掉右边比自己小的第一条鱼, 并且每条鱼吃比自己小的鱼的事件是同时发生的. 返回多少轮之 ...

  8. 2022-01-21:完美矩形。 给你一个数组 rectangles ,其中 rectangles[i] = [xi, yi, ai, bi] 表示一个坐标轴平行的矩形。这个矩形的左下顶点是 (xi,

    2022-01-21:完美矩形. 给你一个数组 rectangles ,其中 rectangles[i] = [xi, yi, ai, bi] 表示一个坐标轴平行的矩形.这个矩形的左下顶点是 (xi, ...

  9. 2021-11-21:map[i][j] == 0,代表(i,j)是海洋,渡过的话代价是2, map[i][j] == 1,代表(i,j)是陆地,渡过的话代价是1, map[i][j] == 2,代表

    2021-11-21:map[i][j] == 0,代表(i,j)是海洋,渡过的话代价是2, map[i][j] == 1,代表(i,j)是陆地,渡过的话代价是1, map[i][j] == 2,代表 ...

  10. 使用4G通信模块和MQTT协议,完成物联网设备开发。

    使用4G通信模块和MQTT协议,完成物联网设备开发. (1)安装并使用4G模块通信模块,建立microPython开发环境: (2)使用提供的Demo开发例程,使用MQTT传输协议连接阿里或腾讯网站, ...