BPMN properties panel implementation

Developers General
1

Hello ,
I followed below steps to integrate bpmn properties panel:

  1. Download bpmn example files and save it in localhost directory

  2. Install nodejs

  3. Open npm cmd and go to the path where you want to run BPMN ( example: cd c:/…/bpmn-js-examples- master/properties-panel/app. Here you will see 3 files index.js, index.html, css folder )

  4. Install browserify using command => npm install browserify ( without changing path )

  5. Then run => browserify index.js -o bundle.js or browserify -t brfs index.js > bundle.js according to requirement. see Stackoverflow answer of Substack

5.1 if got error like “brfs module missing” then execute => npm install brfs

5.2 if got error like “xxxx module missing” then execute => npm install xxxx ( till all module installed)

  1. After this bundle.js file is created in the same path.
  2. Open index.html in editor and replace index.js with bundle.js in script tag.
  3. Open index.html in browser.

After this I got an error like " bundle.js:5092 Uncaught TypeError: fs.readFileSync is not a function "
Please help me how resolve this error.
Or give me detail steps of HOW TO INTEGREATE BPMN WITH PROPERTIES PANEL

2

Hey @dipalim,

please note, that you need npm and grunt to build the example project. The package manager npm is taking care of downloading and installing all the requirements. Grunt is a task runner which takes care of building the example project using browserify. There is no need to run browserify manually.

If you have both npm and Grunt installed you should be able to follow the steps in the Readme to get the example up and running containing bpmn-js and bpmn-js-properties-panel. If you have specific questions please don’t hesitate to ask :slight_smile:

3

Hey @pedesen
Thank you soooo much, very big thanks to you.
Successfully implemented the properties panel in my system.

4

My next task is I have to put " predefined keys" in properties panel extension tab instead of click on Add property I can see my predefined keys their. please give me some idea for that

5

Hi dipalim,

please create a new topic for this question, because it is not quite related to the original question. And please try to be as specific as possible :wink:

6

Hi pedesen,
I created new topic for this, now I am elaborating that on new topic. If you have any ideas regarding to that please share with me

7

Hello @pedesen,
I created new topic Addition of predefined keys in property panel extension tab plaese give me some solution for that.