import router into vue project code example
Example 1: vue router implementation
//Implementation
//main.js - Add below lines
import VueRouter from 'vue-router';
Vue.use(VueRouter);
const router = new VueRouter({
routes,
mode: 'history'
});
new Vue({
router,
render: h => h(App)
}).$mount('#app')
//App.vue - Add below line in v-content
/*
*/
//route.js - We need to craate file under src
import linkName from './components/fileName.vue';
export const routes = [
{
path: '/',
component: linkName
}
]
Example 2: router configuration vue
npm install --save vue-router
//after installing vue-router in the project
//go inside main.js in your project and add
//(just after Vue.config.productionTip=false):
Vue.use(VueRouter):
const routes=[
{path: '/home', component: [componentName]},
{path: '/features', component: [componentName2]},
.
.
.
];
//you can add as many routes as you need
//also add:
const router=new VueRouter({
routes,
mode: 'history'
});
//to make the router accesible for all the project you need to add it inside the new Vue:
new Vue({
router, <----
.
.
}).$mount('#app')
//to make different pages acoording to the route selected, add (inside app.vue):
<----------