vue-vis-network
vue-vis-network copied to clipboard
Constructor must be called with the new operator
When I am trying to add vis-network not in main component I am getting error: Constructor must be called with the new operator
<template>
<el-container >
<el-main>
<network ref="network" :nodes="nodes" :edges="edges" :options="options"> </network>
<button @click="get_data">GetData</button>
</el-main>
</el-container>
</template>
<script>
export default {
components: { Notification },
data () {
return {
nodes: [],
edges: [],
options: []
}
},
methods:
{
get_data()
{
axios.get(base_url + '/graph')
.then((response) => {
this.nodes = response.data.nodes;
this.edges = response.data.edges;
}).catch((error) => {
console.log(error);
});
}
},
}
</script>
index.js:
import vueVisNetwork from 'vis-network'
import locale from 'element-ui/lib/locale/lang/ru-RU'
window.axios = require('axios');
Vue.use(ElementUI, { locale })
Vue.use(Router)
Vue.component('network', vueVisNetwork.Network);
window.base_url = "http://127.0.0.1:8000"
new Vue({
el: '#app',
locale: 'ru',
render: h => h(App)
});
I tried:
Vue.component('network', new vueVisNetwork.Network);
But got error:
Uncaught TypeError: Cannot read property 'hasChildNodes' of undefined
Please provide vue version and dependencies you use (e.g. package.json)
Sorry i am away from PC. Could you look my vue template in my github. I use it as base. And if I right remember did not update it.
I tried add vis not as root element, as I described before.
сб, 22 февр. 2020 г. в 23:00, Dmitriy S. Sinyavskiy < [email protected]>:
Please provide vue version and dependencies you use (e.g. package.json)
— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/r3code/vue-vis-network/issues/5?email_source=notifications&email_token=ABRWNFTOBAGEZFVXD3PEVEDREF76ZA5CNFSM4KXXU72KYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEMVJH2A#issuecomment-589992936, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABRWNFXWYSMWFZHWP54CN2TREF76ZANCNFSM4KXXU72A .
import vueVisNetwork from 'vis-network'
hmm... why import of vueVisNetwork is from vis-network? It should be vue-vis-network
@bubnenkoff this solve this problem import { Network } from "vue-vis-network"; Vue.component("network", Network);
Do you sure that I can use it with Parcel? After import I am getting error:
> [email protected] postinstall D:\code\2018\zakupki-downloader\site\html\node_modules\vis-data
> opencollective postinstall || exit 0
‼ Could not load existing sourcemap of "../node_modules/vue-vis-network/dist/vueVisNetwork.common.j s".
‼ Could not load existing sourcemap of "../node_modules/vue-vis-network/dist/vueVisNetwork.common.j s".
'opencollective' is not recognized as an internal or external command,
operable program or batch file.
'opencollective' is not recognized as an internal or external command,
operable program or batch file.
> [email protected] postinstall D:\code\2018\zakupki-downloader\site\html\node_modules\vis-network
> opencollective postinstall || exit 0
‼ Could not load existing sourcemap of "../node_modules/vue-vis-network/dist/vueVisNetwork.common.j s".
npm WARN [email protected] requires a peer of vis-util@^2.1.0 but none is installed. You must install p eer dependencies yourself.
npm WARN [email protected] No repository field.
npm WARN [email protected] No license field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os" :"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
+ [email protected]
added 8 packages from 64 contributors and audited 13208 packages in 20.372s
found 0 vulnerabilities
‼ Could not load existing sourcemap of "../node_modules/vue-vis-network/dist/vueVisNetwork.common.j s".
npm WARN [email protected] requires a peer of vis-util@^2.1.0 but none is installed. You must install p eer dependencies yourself.
npm WARN [email protected] No repository field.
npm WARN [email protected] No license field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os" :"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
+ [email protected]
updated 1 package and audited 13208 packages in 5.141s
found 0 vulnerabilities
√ Built in 31.89s.
× Cannot read property 'type' of undefined
at Bundler.createBundleTree (D:\code\2018\zakupki-downloader\site\html\node_modules\parcel-bundl er\src\Bundler.js:654:54)
at Bundler.createBundleTree (D:\code\2018\zakupki-downloader\site\html\node_modules\parcel-bundl er\src\Bundler.js:721:12)
at Bundler.createBundleTree (D:\code\2018\zakupki-downloader\site\html\node_modules\parcel-bundl er\src\Bundler.js:721:12)
at Bundler.bundle (D:\code\2018\zakupki-downloader\site\html\node_modules\parcel-bundler\src\Bun dler.js:298:14)
at processTicksAndRejections (internal/process/task_queues.js:89:5)
× Cannot read property 'type' of undefined
at Bundler.createBundleTree (D:\code\2018\zakupki-downloader\site\html\node_modules\parcel-bundl er\src\Bundler.js:654:54)
at Bundler.createBundleTree (D:\code\2018\zakupki-downloader\site\html\node_modules\parcel-bundl er\src\Bundler.js:721:12)
at Bundler.createBundleTree (D:\code\2018\zakupki-downloader\site\html\node_modules\parcel-bundl er\src\Bundler.js:721:12)
at Bundler.bundle (D:\code\2018\zakupki-downloader\site\html\node_modules\parcel-bundler\src\Bun dler.js:298:14)
at processTicksAndRejections (internal/process/task_queues.js:89:5)
× Cannot read property 'type' of undefined
at Bundler.createBundleTree (D:\code\2018\zakupki-downloader\site\html\node_modules\parcel-bundl er\src\Bundler.js:654:54)
at Bundler.createBundleTree (D:\code\2018\zakupki-downloader\site\html\node_modules\parcel-bundl er\src\Bundler.js:721:12)
at Bundler.createBundleTree (D:\code\2018\zakupki-downloader\site\html\node_modules\parcel-bundl er\src\Bundler.js:721:12)
at Bundler.bundle (D:\code\2018\zakupki-downloader\site\html\node_modules\parcel-bundler\src\Bun dler.js:298:14)
at processTicksAndRejections (internal/process/task_queues.js:89:5)
× Cannot read property 'type' of undefined
at Bundler.createBundleTree (D:\code\2018\zakupki-downloader\site\html\node_modules\parcel-bundl er\src\Bundler.js:654:54)
at Bundler.createBundleTree (D:\code\2018\zakupki-downloader\site\html\node_modules\parcel-bundl er\src\Bundler.js:721:12)
at Bundler.createBundleTree (D:\code\2018\zakupki-downloader\site\html\node_modules\parcel-bundl er\src\Bundler.js:721:12)
at Bundler.bundle (D:\code\2018\zakupki-downloader\site\html\node_modules\parcel-bundler\src\Bun dler.js:298:14)
at processTicksAndRejections (internal/process/task_queues.js:89:5)
To break all project enough to add one line:
import { Network } from "vue-vis-network";

Vue.component('network', new vueVisNetwork.Network);
This should be
import { Network } from "vue-vis-network";
Vue.component('network', Network);
I've updated the Readme in master
Do not work. I checked right now and got error:
vueVisNetwork.common.js:1175 Uncaught SyntaxError: Unexpected token '*'
at Object../node_modules/vis-network/dist/vis-network.esm.min.js (vueVisNetwork.common.js:1175)
at __webpack_require__ (vueVisNetwork.common.js:21)
at eval (main.js:2)
at Module../src/main.js (vueVisNetwork.common.js:1270)
at __webpack_require__ (vueVisNetwork.common.js:21)
at eval (entry-lib-no-default.js:3)
at Module../node_modules/@vue/cli-service/lib/commands/build/entry-lib-no-default.js (vueVisNetwork.common.js:98)
at __webpack_require__ (vueVisNetwork.common.js:21)
at vueVisNetwork.common.js:85
at Object.parcelRequire.../node_modules/vue-vis-network/dist/vueVisNetwork.common.js (vueVisNetwork.common.js:88)