search

projectstorm / react-diagrams

a super simple, no-nonsense diagramming library written in react that just works
https://projectstorm.cloud/react-diagrams
MIT License
8.73k stars 1.18k forks source link

Unable to get sample code to work. #460

Open damntourists opened 5 years ago

damntourists commented 5 years ago

I'm following examples on: https://projectstorm.gitbook.io/react-diagrams/getting-started/using-the-library

First issue was installing @projectstorm/react-diagrams. I could not get any examples to run without npm install --save the following:

@emotion/core
@emotion/styled
@projectstorm/react-canvas-core
closest
mathjs
pathfinding

After installing those, I was able to start my react-app. Adding the following triggers an error:

    const engine = createEngine();

Error being: TypeError: class constructors must be invoked with 'new'

It's expecting new createEngine(); but all example code and docs don't show use of new.

I'm curious if anyone else is experiencing this or if I perhaps installed this incorrectly or using this incorrectly?

Thanks

Dizzienoo commented 5 years ago

Had similar issues, did manage to get something "running" in the end but then none of the diagram would render, all just invisible html elements that then wouldn't display. Can re-create what I tried tonight for more clarity

damntourists commented 5 years ago

That would be awesome!

yaniving commented 5 years ago

I had the same problem after I added the CSS I all worked fine. The most important thing is to add height to your canvas.

this helped me

https://stackoverflow.com/questions/49513323/react-diagrams-invisible

sibeshkar commented 5 years ago

For anyone stuck at this stage where you need to install multiple additional dependencies, just use this command, and add CSS for the CanvasWidget element:

npm install --save @emotion/core @emotion/styled @projectstorm/react-canvas-core closest mathjs pathfinding dagre paths-js resize-observer-polyfill
alexandrudanpop commented 5 years ago

Could we have those deps installed as peer dependencies of maybe projectstorm/react-canvas-core? Or the other packages that will use them?

I think this library is really great and it would be cool to have the out of the box experience after adding the main package.