Answer the question
In order to leave comments, you need to log in
Why doesn't Vue components (Laravel Mix + Vue js) work?
Good people help, for the second day I can not solve the problem!
Laravel 7.28.3
Templates for vue components are not displayed, just a tag with the name of the component and that's it.
laravel.mix.js
const mix = require('laravel-mix');
mix.js('resources/js/app.js', 'public/js')
.extract(['vue'])
.sass('resources/sass/app.scss', 'public/css')
.styles([
'resources/css/account.css',
'resources/css/admin_panel.css',
'resources/css/admin_panel_orders.css',
'resources/css/amimation.css',
'resources/css/buscket.css',
'resources/css/header_footer.css',
'resources/css/layot.css',
'resources/css/lefter.css',
'resources/css/main.css',
'resources/css/popups.css',
'resources/css/radio.css',
'resources/css/slick.css',
'resources/css/stylesheet.css',
], 'public/css/all.css');
require('./bootstrap');
window.Vue = require('vue');
// const files = require.context('./', true, /\.vue$/i)
// files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], files(key).default))
Vue.component('example-component', require('./components/ExampleComponent.vue').default);
Vue.component('view-products-component', require('./components/ViewProductsComponent.vue').default);
const app = new Vue({
el: '#app',
});
<template>
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">Example Component</div>
<div class="card-body">
I'm an example component.
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
mounted() {
console.log('Component mounted.')
}
}
</script>
Answer the question
In order to leave comments, you need to log in
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question