Integrate bpmn-js-properties-panel in web application


#1

Hi,

I am trying to build a web application with mvc .net and integrate bpmn-js-properties-panel. I followed the example in https://github.com/bpmn-io/bpmn-js-properties-panel/ , however, when reaching code that uses “requrie” like
" propertiesPanelModule = require(‘bpmn-js-properties-panel’),"
, I have no idea to make it work in my javascript codes.

I tried to include the require js script
and then add the library scripts like Modeler.js to my script folder , but as the modeler.js is requiring other scripts like inherits.js, ids.js, do i need to add them one by one into my script folder, or i am probably on the wrong track?

Actually, what is the correct steps to integrate bpmn-js-properties-panel in the web application which i use mainly javascript and csharp?

Thanks.


#2

require is CommonJS module syntax (not to confuse with RequireJS). bpmn-js uses CommonJS modules so in order to run this code in the browser you must bundle it first. This is what this Grunt task is for in the example project. If you haven’t worked with these things before make sure to get familiar with CommonJS modules and how to bundle them for the browser (e.g. Browserify).


How can I solve problem with require()?
#3

Thank you Philipp for your comments,

I tried to run the grunt task, but the task failed with “fatal windows exception code 0xc0000005 PhantomJS has crashed” , “Warnning : Task karma:single failed” , and probably because of these exception , dist folder cannot be created.


#4

Can you please elaborate? What command(s) did you run? Karma and PhantomJS are for testing and not part of this example.


#5

Sorry for causing confusion as I forgot to mention I followed not only https://github.com/bpmn-io/bpmn-js-properties-panel but also https://github.com/bpmn-io/bpmn-js-examples/tree/master/properties-panel .Anyway, I have already solved the problem by building it in nodejs environment. Thanks for the help.