Vue.js in Laravel

Question

I am trying to use vue.js with laravel for the first time.

In the blade.php file:

<html>
    <body class>
        <div id="app"> 
            <favourup></favourup>
        </div>
        <script src="{{ asset('js/app.js') }}"></script>
    </body>
</html>

In the app.js file:

Vue.component('favourup', require('./components/Favourup.vue'));

const app = new Vue({
    el: '#app',
});

In the vue file:

<template>
    <div>
        <h2>FavourUp</h2>
    </div>
</template>

I am not getting any errors however the local host displays an empty web page when it should display 'FavourUp'

Answer 1

you should write.default at end of require vue components because of part of the vue-loader 15 updates, if your code uses the CommonJS syntax for importing EcmaScript modules, you'll need to append.default: https://laravel-mix.com/docs/4.0/upgrade#importing-es-modules but as @Ifaruki said you can import it too here's the code:

// first
Vue.component('favourup', require('./components/Favourup.vue').default);

// second
import Favourup from './components/Favourup.vue';

Vue.component('favourup', Favourup);

Vue.js in Laravel

Question

1 answers

solution1
0 2020-06-19 12:46:10

Vue.js in Laravel

Question

1 answers

solution1 0 2020-06-19 12:46:10

solution1
0 2020-06-19 12:46:10