Michel Gisenaël
Michel Gisenaël

Reputation: 351

Vue component not showed in vue dev tools

I'm using vue js on laravel, i have two different file app.js and app-filter.js in my resource/js folder

what i want is to call the app-filter.js on specific page but the app js is always called for each page:

in my app-filter.js i have

const filter = Vue.component('filter-project', require('./components/filter-project.vue').default);
 
const appfilterproject = new Vue({
    el: '#app-filter-project',
    components: {
        'filter-project': filter
    }
});

and in my app.js i

const app= new Vue({ el: '#app', components: { 'other-component': othercomponent } });

so in my page when i call app-filter i have these import

<script src="{{ asset('front/js/app-filter-project.js') }}"></script>
<script src="{{ asset('front/js/app.js') }}" defer></script>

the order is respective

and in my page i call

<div id="app">
    <other-component></other-component>
</div>

<div id="app-filter-project">
    <filter-project></filter-project>
</div>

the two component are showed in the page but on my devtools it show only my other-component

and any event on filter-project component not work , if i remove app.js from import, all thing work well

Upvotes: 0

Views: 407

Answers (1)

Renato Moor
Renato Moor

Reputation: 1

Probably you are using Vue 3 and it is only supported by Vue.js devtools Beta, try to install it and reopen your browser

Upvotes: 0

Related Questions