新建的vue项目没有router文件
时间: 2023-12-23 19:15:47 浏览: 144
前端项目-vue-router.zip
是的,新建的 Vue 项目默认是没有安装 Vue Router 的。如果需要使用 Vue Router,你需要手动进行安装和配置。
首先,你需要在项目目录下执行以下命令来安装 Vue Router:
```
npm install vue-router
```
安装完成后,在 src 目录下新建一个 router 目录,并在该目录下新建一个 index.js 文件,作为 Vue Router 的配置文件。
在 index.js 文件中,你需要引入 Vue 和 Vue Router,并定义路由表,如下所示:
```javascript
import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '@/views/Home.vue'
Vue.use(VueRouter)
const routes = [
{
path: '/',
name: 'Home',
component: Home
}
]
const router = new VueRouter({
mode: 'history',
base: process.env.BASE_URL,
routes
})
export default router
```
上面的代码定义了一个路由表,只包含了一个路由,即访问根路径时展示 Home 组件。
最后,在 main.js 文件中,你需要引入 router 并将其挂载到 Vue 实例上,如下所示:
```javascript
import Vue from 'vue'
import App from './App.vue'
import router from './router'
Vue.config.productionTip = false
new Vue({
router,
render: h => h(App)
}).$mount('#app')
```
这样,就完成了 Vue Router 的配置。
阅读全文