Failed to mount component: template or render function not defined.
maxxscho opened this issue · comments
I have a fresh install of laravel with the Example.vue file. if I'm testing it without running gulp, everything works fine. Once I started using gulp and everything gets compiled new, I get the following error in the console:
vue.js?0598:2611[Vue warn]: Failed to mount component: template or render function not defined.
(found in component <example> ...
The correct Vue is loaded from vue/dist/vue.js
. I haven't change anything on the fresh Laravel installation, except the necessary changes in the view file to make an #app
container.
Hello @maxxscho
Thank your for your interest in this project.
However, your issue is a usage/support question, and the issue tracker is reserved exclusively for bug reports and feature requests.
We encourage you to ask it on the forum , Stack Overflow or on gitter and are happy to help you out there.
Had the same issue as @maxxscho. I was able to resolve it by changing my gulpfile.js from this
elixir(function(mix) {
mix.webpack('script.js');
});
elixir(function(mix) {
mix.styles('style.css');
});
to this
elixir(function(mix) {
mix.webpack('script.js');
mix.styles('style.css');
});
Have same problem...
As @benbjurstrom said, and @JeffreyWay too here, calling elixir
only once solves the problem.
Right - you should only call elixir() once, per Gulpfile.
According to vue docs, i solved this problem, adding 4th parameter to webpack:
mix.webpack('app.js', null, null, {
resolve: {
alias: {
'vue$': 'vue/dist/vue.js'
}
}
})
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.