search

rcarcasses / vue-cytoscape

cytoscape.js now inside vue.js
https://rcarcasses.github.io/vue-cytoscape
MIT License
96 stars 34 forks source link

Error with latest vue-cli project #3

Closed enodr closed 5 years ago

enodr commented 5 years ago

Hi,

I am trying to use the component with the latest vue-cli and when trying to serve the app I get this error: [Vue warn]: Failed to mount component: template or render function not defined.

I rebuilt from source but cannot find what the problem is. Any idea?

rcarcasses commented 5 years ago

Hi @enodr, can you provide a minimum reproducible example so I can check what's going wrong? Latest version is 0.2.3, are you using that one?

enodr commented 5 years ago

I figured out. You have packaged as a Vue plugin not a view component, thus I overlooked the fact that I had to declare Vue.use(VueCytoscape) inside the main.js just before calling new Vue(). Maybe you could just mention this in the readme to clear up confusions. I am just wondering why using the plugin format instead of simple component? Is this because $cytoscape is made accessible globally?

// main.js
import VueCytoscape from 'vue-cytoscape'
import 'vue-cytoscape/dist/vue-cytoscape.css'
Vue.use(VueCytoscape) / / mandatory before calling new Vue(...)
...
new Vue(...)

Thanks for the work and your help!

rcarcasses commented 5 years ago

Great that you figured out :) The instructions you mention are already on the README but anyway I'll try to improved it to make it clearer for new users. Yes, the plugin option is the cleanest way (I think) to register a global variable. If you have any other difficulties, let me know!