Open biskit opened 1 year ago
demo
went away when we switched from webpack to microbundle in #99 - @akx how hard would it be to restore that functionality?
I think just npm build
, then open demo.html
...
tried that, don't work
console throws logs
@biskit Hm – works on my machine (though sorry, it's npm run build
– I'm used to yarn build
):
git clean -fdx . && npm ci && npm run build && open demo.html
et voilà!
does not work...
did this
bxs:rc2.0 bs$ yarn install
yarn install v1.22.19
[1/4] 🔍 Resolving packages...
success Already up-to-date.
$ run-s build build:docgen
yarn run v1.22.19
$ microbundle --globals=react=React,cytoscape=cytoscape,prop-types=PropTypes
Build "react-cytoscapejs" to dist:
1956 B: react-cytoscape.js.gz
1763 B: react-cytoscape.js.br
1530 B: react-cytoscape.modern.js.gz
1373 B: react-cytoscape.modern.js.br
1909 B: react-cytoscape.module.js.gz
1727 B: react-cytoscape.module.js.br
2.04 kB: react-cytoscape.umd.js.gz
1.85 kB: react-cytoscape.umd.js.br
✨ Done in 3.82s.
yarn run v1.22.19
$ react-docgen src/component.js --pretty -o dist/react-cytoscape.docgen.json
✨ Done in 0.52s.
✨ Done in 5.21s.
bxs:rc2.0 bs$ yarn build
yarn run v1.22.19
$ microbundle --globals=react=React,cytoscape=cytoscape,prop-types=PropTypes
Build "react-cytoscapejs" to dist:
1956 B: react-cytoscape.js.gz
1763 B: react-cytoscape.js.br
1530 B: react-cytoscape.modern.js.gz
1373 B: react-cytoscape.modern.js.br
1909 B: react-cytoscape.module.js.gz
1727 B: react-cytoscape.module.js.br
2.04 kB: react-cytoscape.umd.js.gz
1.85 kB: react-cytoscape.umd.js.br
✨ Done in 3.87s.
bxs:rc2.0 bs$ open demo.html
got errors in console:
Download the React DevTools for a better development experience: https://fb.me/react-devtools
You might need to use a local HTTP server (instead of file://): https://fb.me/react-devtools-faq [react-dom.development.js:25129:19](file:///Users/bs/github.com/rc2.0/node_modules/react-dom/umd/react-dom.development.js)
Loading failed for the <script> with source “file:///Users/bs/github.com/rc2.0/node_modules/cytoscape/dist/cytoscape.min.js”. [demo.html:9:1](file:///Users/bs/github.com/rc2.0/demo.html)
Uncaught TypeError: l.default is not a constructor
componentDidMount component.js:61
React 17
<anonymous> demo.html:86
[component.js:61:27](file:///Users/bs/github.com/rc2.0/src/component.js)
Uncaught TypeError: this._cy is undefined
componentWillUnmount component.js:96
React 26
<anonymous> demo.html:86
[component.js:96:4](file:///Users/bs/github.com/rc2.0/src/component.js)
The above error occurred in the <o> component:
in o (created by TestComponent)
in TestComponent
Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://fb.me/react-error-boundaries to learn more about error boundaries. [react-dom.development.js:19662:15](file:///Users/bs/github.com/rc2.0/node_modules/react-dom/umd/react-dom.development.js)
Uncaught undefined [react-dom.development.js:11239:9](file:///Users/bs/github.com/rc2.0/node_modules/react-dom/umd/react-dom.development.js)
The above error occurred in the <o> component:
in o (created by TestComponent)
in TestComponent
Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://fb.me/react-error-boundaries to learn more about error boundaries. [react-dom.development.js:19662:15](file:///Users/bs/github.com/rc2.0/node_modules/react-dom/umd/react-dom.development.js)
Uncaught undefined [react.development.js:2210:11](file:///Users/bs/github.com/rc2.0/node_modules/react/umd/react.development.js)
Uncaught SyntaxError: JSON.parse: unexpected end of data at line 1 column 1 of the JSON data
<anonymous> file:///Users/bs/github.com/rc2.0/demo.html:81
[demo.html:81:21](file:///Users/bs/github.com/rc2.0/demo.html)
```
@biskit When you run yarn
, it will warn you (at least my yarn warns me) that
warning: package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
And indeed, if you build the package with yarn
, it currently will cause the errors you're seeing.
Please use npm
.
i deleted the lock file did a clean yarn install/build
and it still caused errors
however, doing npm install; npm run build; open demo.html
works
thanks
v1.2.1 has
"demo": "cross-env NODE_ENV=development webpack-serve webpack.config.js --open --open-path demo.html"
v2.0 does not. pls add this target for noobs to test your demo out
btw, the demo with "preset" somehow finds position x:0, y:0 to be at middle left than top left corner