CODEWITHSUNDEEP
laravelvue.jscomponents
Christophe
Christophe

Reputation: 399

Laravel + VueJS - Component doesn't displayed

I'm trying to add VueJS in my Laravel app, but my first component is not displayed on my page.

As you can see on the source page, we can see the component "login". enter image description here

And this is the associate code:

<template>
    <p>Coucou je suis un élément Vue.JS</p>
</template>

<script>
    export default {
        name: "login"
    }
</script>

<style scoped>

</style>

It's just a simple component that display a string.

Here you have the app.js

/**
 * First we will load all of this project's JavaScript dependencies which
 * includes Vue and other libraries. It is a great starting point when
 * building robust, powerful web applications using Vue and Laravel.
 */

require('./bootstrap');

window.Vue = require('vue');

/**
 * Next, we will create a fresh Vue application instance and attach it to
 * the page. Then, you may begin adding components to this application
 * or customize the JavaScript scaffolding to fit your unique needs.
 */

Vue.component('example-component', require('./components/ExampleComponent.vue'));
Vue.component('login', require('./components/Auth/Login.vue'));

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

But my problem is that nothing appears on the html page :/ It's completely blank...

enter image description here

If someone could explain what's wrong, it will be so appreciate. Thank in advance.

Upvotes: 1

Views: 1477

Answers (1)

Christophe
Christophe

Reputation: 399

Well, i found my mistake. I forget to add theses two lines :

<script src="{{ asset('js/manifest.js') }}"></script>
<script src="{{ asset('js/vendor.js') }}"></script>

Upvotes: 1

Related Questions