Closed daming-lu closed 6 years ago
I just came across the same problem, when I tried to switch back to the official dagre-d3. Some time back I thought this repository was dead and created a fork that depends on ciena-dagre and works fine in Vue: https://github.com/christianvoigt/dagre-d3
But let's hope this issue gets fixed and we can use the real dagre-d3 in Vue.
good news: I just integrated the official dagre-d3 v0.6.1 successfully in a Vue app. I don't really know what fixed the problems, but I used the new vue-cli (still in beta) to create a completely new boilerplate for my old Vue code and this worked. Maybe the reason is the newer webpack version that comes with it.
So I guess this issue can be closed.
how to use dagre-d3 in Vue?
how to use dagre-d3 in Vue?
webpack": "1.13.2"
i find there's no main field in package.json, so import from 'dagre-d3' is import the package's root index.js. there's a build js in the dist, just import this one will fix it. import dagreD3 from 'dagre-d3/dist/dagre-d3';
wish a exmple
i find there's no main field in package.json, so import from 'dagre-d3' is import the package's root index.js. there's a build js in the dist, just import this one will fix it. import dagreD3 from 'dagre-d3/dist/dagre-d3';
This also fixed my problem, dargre-d3 cannot used after yarn build
on production. My import code is the following:
And my versoin is:
{
"dependencies": {
"@element-plus/icons-vue": "^2.1.0",
"@soerenmartius/vue3-clipboard": "^0.1.2",
"axios": "0.21.3",
"codemirror-editor-vue3": "^0.2.4",
"dagre-d3": "^0.6.4",
"echart": "^0.1.3",
"echarts": "^5.2.2",
"element-plus": "~2.3.6",
"js-yaml": "^4.1.0",
"json-stringify-pretty-compact": "^3.0.0",
"json-to-pretty-yaml": "^1.2.2",
"jsonlint-mod": "^1.7.6",
"less": "^4.1.1",
"less-loader": "^7.3.0",
"lodash": "^4.17.21",
"mitt": "^3.0.0",
"moment-mini": "^2.22.1",
"nprogress": "^0.2.0",
"path": "0.12.7",
"path-to-regexp": "^6.2.0",
"tinymce": "4.9.11",
"vite-plugin-treat-umd-as-commonjs": "^0.1.2",
"vue": "3.2.26",
"vue-axios": "^3.2.5",
"vue-cookies": "^1.7.4",
"vue-echarts": "^6.0.0",
"vue-router": "4.0.12",
"vuex": "4.0.2",
"xterm": "^4.18.0",
"xterm-addon-attach": "^0.6.0",
"xterm-addon-fit": "^0.5.0"
}
}
I've 'npm installed' dagre-d3 and wanted to use it in my Vue app. But after I imported it as below:
I got errors like below: