Vue js component not working in laravel blade file

I am new in vueJS and i try to implement my custom component in my laravel .blade.php file but it's not working My code like this

Vue.component('todo-item', {
        props: ['todo'],
        template: '<li></li>'
    })
    var app7 = new Vue({
        el: '#app-7',
        data: {
            groceryList: [
                {text: 'Vegetables'},
                {text: 'Cheese'},
                {text: 'Whatever else humans are supposed to eat'}
            ]
        }
    }) 

---

<div id="app-7">
<ol>
    <todo-item v-for="item in groceryList" v-bind:todo="item"></todo-item>
</ol>

i have add this same code in .html file then it's working

from Newest questions tagged laravel-5 - Stack Overflow http://ift.tt/2m2Nno0
via IFTTT