vue2安装 vue-router
时间: 2024-12-19 20:13:18 浏览: 8
Vue Router是一个专门为Vue.js设计的路由库,它允许你在单页面应用(SPA)中导航。要在Vue 2中安装Vue Router,你需要按照以下步骤操作:
1. **首先确保已安装Vue CLI**:如果你还没有全局安装Vue CLI,可以在命令行中运行 `npm install -g @vue/cli` 或者 `yarn global add @vue/cli`。
2. **创建一个新的Vue项目**:如果已有项目,跳过此步;如果没有,打开命令行,进入你想创建项目的目录,然后输入 `vue create project-name` 并回车。
3. **安装Vue Router**:在新创建的项目里,进入项目文件夹,比如 `cd project-name`,然后运行 `npm install vue-router` 或 `yarn add vue-router` 来添加依赖。
4. **配置router.js**:在项目的src下创建一个名为router.js的文件(如果没有就新建),在此文件中导入Vue Router并配置路由规则。例如:
```javascript
import Vue from 'vue';
import Router from 'vue-router';
Vue.use(Router);
const routes = [
{ path: '/', component: Home },
{ path: '/about', component: About }
];
export default new Router({
routes
});
```
5. **在main.js中引入并挂载路由器**:
```javascript
import router from './router';
new Vue({
el: '#app',
router
});
```
现在,你应该能够通过`<router-view>`组件动态渲染不同的视图了。
阅读全文