Laravel 5.4 Vue.JS Failed to mount component: template or render function not defined

It should be require('./components/Example.vue').default. Since v13, vue-loader exports the component as the default key, which still works the same when using import, but requires the above when using require.


Try this

Vue.component('example-component', require('./components/ExampleComponent.vue').default);

As of now, the plaster I have is to add a 'default()' to all Vue object's component.

Vue.component('form-component', require('./components/FormComponent').default);
Vue.component('gratitude-pop', require('./components/GratitudePop').default);//..etc..etc

Running this package:

  "devDependencies": {
        "axios": "^0.18",
        "bootstrap": "^4.0.0",
        "cross-env": "^5.1",
        "jquery": "^3.2",
        "laravel-mix": "^4.0.7",
        "lodash": "^4.17.5",
        "popper.js": "^1.12",
        "resolve-url-loader": "^2.3.1",
        "sass": "^1.15.2",
        "sass-loader": "^7.1.0",
        "vue": "^2.5.17"
    },
    "dependencies": {
        "vuex": "^3.0.1"
    }

Throw in your thumbs-up for using VUEX ;P

Tags:

Laravel

Vue.Js