paed01 / bpmn-engine

BPMN 2.0 execution engine. Open source javascript workflow engine.
MIT License
891 stars 167 forks source link

Usage in react? #71

Closed wv-leifel closed 5 years ago

wv-leifel commented 5 years ago

Hey paed01,

is it possible to use bpmn-engine in a react project?

The first example "Execute" works fine in a normal node project. With an react project ist fails everytime with "Uncaught (in promise) TypeError: BpmnModdle is not a constructor" in the getModdleContext method of bpmn-engine.

Thank you in advance!

paed01 commented 5 years ago

It shouldn’t be a problem.

Can you provide a stack trace?

wv-leifel commented 5 years ago

Hey,

the error looks like the following TypeError: BpmnModdle is not a constructor at index.js:225 at new Promise (<anonymous>) at getModdleContext (index.js:224) at serializeSource (index.js:213) at Engine (index.js:57) at Button.handleClick (button.js:29) at HTMLUnknownElement.callCallback (react-dom.development.js:363) at Object.invokeGuardedCallbackDev (react-dom.development.js:412) at invokeGuardedCallback (react-dom.development.js:466) at invokeGuardedCallbackAndCatchFirstError (react-dom.development.js:481) at executeDispatch (react-dom.development.js:614) at executeDispatchesInOrder (react-dom.development.js:639) at executeDispatchesAndRelease (react-dom.development.js:744) at executeDispatchesAndReleaseTopLevel (react-dom.development.js:753) at forEachAccumulated (react-dom.development.js:725) at runEventsInBatch (react-dom.development.js:770) at runExtractedPluginEventsInBatch (react-dom.development.js:916) at handleTopLevel (react-dom.development.js:6171) at batchedEventUpdates (react-dom.development.js:2422) at dispatchEventForPluginEventSystem (react-dom.development.js:6271) at dispatchEvent (react-dom.development.js:6301) at unstable_runWithPriority (scheduler.development.js:674) at runWithPriority$2 (react-dom.development.js:11834) at discreteUpdates$1 (react-dom.development.js:22935) at discreteUpdates (react-dom.development.js:2440) at dispatchDiscreteEvent (react-dom.development.js:6254)

I've just pushed the code I'm using to https://github.com/wv-leifel/bpmn-test .

In https://github.com/wv-leifel/bpmn-test/blob/master/src/button/button.js in the handleClick the error is returned in line 39.

wv-leifel commented 5 years ago

Found it and has nothing to do with your code.

Babel exports to .default so i would need const BpmnModdle = require('bpmn-moddle').default; or the babel-plugin-add-module-exports plugin.

Thank you very much!

paed01 commented 5 years ago

No problem, glad to help.

May I suggest using bpmn-elements instead. It is written in ES6 and suitable for frontend projects. The engine is basically a wrapper for bpmn-elements and bpmn-moddle.

Fahadjalal09 commented 3 years ago

Found it and has nothing to do with your code.

Babel exports to .default so i would need const BpmnModdle = require('bpmn-moddle').default; or the babel-plugin-add-module-exports plugin.

Thank you very much!

Found it and has nothing to do with your code.

Babel exports to .default so i would need const BpmnModdle = require('bpmn-moddle').default; or the babel-plugin-add-module-exports plugin.

Thank you very much!

I'm facing same issue can you help me please? Screenshot from 2021-06-07 15-29-23