how to return a vuejs view in laravel routing file

Question

I have a Laravel + VueJS application and I am having trouble with the following issue:

What method would I use to return the Vue Page. Return View doesnt work which is what I expected but I am unaware what I put there.

Here's my code:

routes/web.php-

Route::get('/pizzas', function () {
    return view('Pizzas');
});

the Vue file directory is resources/js/Pages/Pizzas.vue

Vue is using one-page concept. Not work like that. Use API json request-response and init page what load vuejs. — Numichi
– Numichi, Commented Nov 14, 2020 at 4:43

Wyrone · Accepted Answer · 2020-11-15 01:19:51Z

1

You can try to add your component to app.js(Im assuming you already have this in your resources folder) with:

window.Vue = require('vue');
Vue.component('pizza-component', require('./Pages/Pizzas.vue').default);
const app = new Vue({
    el: '#app',
});

And in your laravel blade, use the component like this:

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

This works for me when trying to use a Vue compnent in a blade template file

answered Nov 15, 2020 at 1:19

Wyrone

926 bronze badges

Sign up to request clarification or add additional context in comments.

1 Answer 1