CODEWITHSUNDEEP
vuejs2vue-router
Devarshi Roy
Devarshi Roy

Reputation: 25

Setting up Vue router in Vue2 using the script tag only.like angular 1.x router

I need to set up vue router in my vue ja 2 application .I am not using vue cli just the cdn for vue Js .I am not able to find a way of how to set up vue router with cdn.can anyone suggest any documentation or the technique of how to achieve that ?? Any help would be much appreciated

Upvotes: 0

Views: 852

Answers (1)

Mark
Mark

Reputation: 92440

Here's a bare bones example to help get going:

<html>
<head>
    <script src="https://unpkg.com/vue"></script>
    <script src="https://unpkg.com/[email protected]/dist/vue-router.js"></script>
</head>
<body>
<div id="app">
    <p><router-link to="/page1">Go to Page 1</router-link></p>
    <p><router-link to="/page2">Go to Page 2</router-link></p>
    <p><router-view></router-view></p>
</div>

<script>
    var PageTwoComponent = Vue.component('comp2',{
        template: '<p>Component Two</p>'
    })
    var PageOneComponent = Vue.component('comp1',{
        template: '<p>Component One</p>'
    })

    const routes = [
        {path: '/page1', component: PageTwoComponent},
        {path: '/page2', component: PageOneComponent}
    ]

    const router = new VueRouter({
        routes
    })

    var app = new Vue({
        router
    }).$mount('#app')

</script>
</body>
</html>

Upvotes: 5

Related Questions