Vue-router 的使用 (vue3.x版本)

gblfy

于 2021-10-31 18:58:16 发布

阅读量2.1k

点赞数

分类专栏： vue3 文章标签： vue.js npm javascript

本文链接：https://blog.csdn.net/weixin_40816738/article/details/121068105

版权

vue3 专栏收录该内容

29 篇文章

订阅专栏

本文介绍了如何使用npm和yarn安装Vue Router，包括默认安装和Vite项目的安装方式，以及详细步骤。接着，文章展示了Vue Router的基本使用方法，包括在main.js中引入并注册，以及创建和配置路由的代码示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

文章目录

一、安装

1. npm

默认

npm install vue-router -S 

# 卸载
npm uninstall vue-router

vite

# 安装
npm install vue-router@next -S 

# 卸载
npm uninstall vue-router@next

2. yarn

默认

# 安装
yarn add vue-router -S 

# 卸载
yarn remove vue-router

vite

# 安装
yarn add vue-router@next -S

# 卸载
yarn remove vue-router@next

二、使用

2.1. 引入+注册

main.js

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'

const app = createApp(App)
app.use(router).mount('#app')

2.2. 创建+配置

import {createRouter, createWebHistory} from "vue-router";

const routes = [
// 省略
]

const index = createRouter({
  history: createWebHistory(),
  routes
})

export default index