Menu
in my Laravel project I'm using Vue library and I'm trying to use vue router in my modules, but when I tried import vue router as usually (see code below) I got an error in my console: Uncaught TypeError: window.Vue.use is not a function
Any ideas how to solve this issue? I have created this module using webpack.
import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)
import App from './App.vue'
const router = new VueRouter({
routes: [{
'path' : '/user/:id/'
}]
});
new Vue({
router,
el: '#play',
render: h => h(App)
});
898
I think it's an issue with loading/importing Vue in laravel.
Have you tried changing it to the following:
import Vue from 'vue/dist/vue'
window.Vue = Vue
Vue.use(VueRouter)
You could try console.log(window.Vue) to see if Vue gets attached correctly, or if window.Vue is undefined. You could also try that like console.log(Vue) to see what gets imported.
59
Not sure, but probably it was a fault of my negligence.
The problem was in JS files order while the page was loading up. Still not sure why this happened. I tried to use generated JS file before tag, but this didn't work, so I just put my JS file right after Vue template container and it started to work (check snippet below). If somebody has any explanation for that, I would be glad to hear that, because now I could call it "magic".
<body>
@yield('after_body_open')
{{--Header--}}
<header>
@include('layouts.top-bar')
@include('layouts.header')
</header>
{{--Page content--}}
<main>
@yield('content')
</main>
<div id="play"></div>{{--Vue instance--}}
<script src="{{ asset('js/vue/play.js') }}"></script> **TO HERE**
{{--Footer--}}
<footer></footer>
{{--Notifications block--}}
<div id="notifications"></div>{{--Vue instance--}}
{{--Required JS files--}}
<script src="{{ asset('js/vue/navigation.js') }}"></script>
<script src="{{ asset('js/vue/notifications.js') }}"></script>
<script src="{{ asset('js/vue/play.js') }}"></script> **FROM HERE**
@yield('before_body_close')
</body>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With