Issue installing properties panel

Trying out a couple of example to familiarize with bpmn-js, events and overlays work, but I got an issue when installing the properties panel extension.

Here’s the message I receive:

npm WARN bpmn-js-properties-panel@0.19.1 requires a peer of bpmn-js@>=0.12 <0.26 but none is installed. You must install peer dependencies yourself.

Having no experience with this I thought it might be up to the version of bpmn-js (current) I use, so I went as low as 0.24.0 but I receive this message everytime I install the properties panel and as such won’t let me use it.

What am I overlooking?

Thanks!

We forgot to include the latest version of bpmn-js with the properties panel.

This should be resolved now with the release of bpmn-js-properties-panel@0.20.0.

Thanks for reporting.

Hi @nikku, thanks for your reply,

It’s not completely solved for me yet, I receive a somewhat similar message:

bpmn-js-properties-panel@0.20.0 requires a peer of bpmn-js@>=0.12 <1.0 but none is installed

If you need more info, please let me know,

(here’s what I did, started from scratch in a new folder with Visual Studio Code)

git clone https://github.com/bpmn-io/bpmn-js.git -b v0.26.6 .

npm install

All fine, then I did:

npm install --save bpmn-js-properties-panel

This is because you’re essentially installing bpmn-js-properties-panel as a child dependency, not a peer dependency.

The following sets up a new project with both, bpmn-js and bpmn-js-properties-panel as dependencies:

cd some-project
npm init
npm i --save bpmn-js bpmn-js-properties-panel

You would then roll your own version of bpmn-js + properties-panel like this:

var BpmnJS = require('bpmn-js/lib/Modeler'),
    propertiesPanelModule = require('bpmn-js-properties-panel'),
    propertiesProviderModule = require('bpmn-js-properties-panel/lib/provider/bpmn');

// exposing a factory function for simplicity
module.exports = createBpmnJS(options) {

  var actualOptions = Object.assign({
    additionalModules: [
      propertiesPanelModule,
      propertiesProviderModule
    ]
  }, options);

  return new BpmnJS(actualOptions);
};

…and use it:

var bpmnJS = createBpmnJS({
  container: '#canvas',
  propertiesPanel: {
    parent: '#properties'
  }
});

Thanks @nikku for your reply,

Due to holidays I didn’t have the chance to follow up on this.

So I took all of your advices and went ahead, please bear with me as I’m really a noob on npm…

Started with a new project to get the latest bpmn-js, install, build, run, move ‘dist’ over to my own application (in which I already extracted the process/xml into my own isa95 database as segment dependencies).

All good, baseline set.
went ahead with npm init as you told me to.
Accepted all the defaults, all seems good.
with npm i --save bpmn-js bpmn-js-properties-panel I’m fairly sure that you meant npm install --save bpmn-js bpmn-js-properties-panel … The message about installing the peer dependency is gone!. Great!, however, there’s still a message:

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.1.3 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.3: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

but since it’s telling me that it’s optional and not supported on the platform I’m on, for now I’m not too worried, so I continue.

You then indicate to ‘roll your own’ … perhaps a bit too farfetched for this noob :thinking:
So I first decided to see if the ‘dist’ still works after instaling the extra packages, without changing anything I build, run and move ‘dist’ to my own application… everything works fine, however, I did not make any call to the properties panel yet.

Like I said, completely ‘roll-your-own’ is a bit too steep for me, so I decided to edit /lib/Viewer.js and put this in to ‘register’ the properties-panel:

var propertiesPanelModule = require('bpmn-js-properties-panel'),
    propertiesProviderModule = require('bpmn-js-properties-panel/lib/provider/bpmn');

I then build, run and move over the ‘dist’ folder in my application. When I then open it, I receive the message:

0x800a139e - JavaScript runtime error: Cannot find module 'events'
which occures on
throw f.code="MODULE_NOT_FOUND",f

Now, putting 1 and 1 together, I was unable to install the fsevents module and I receive a message about a module not being found called ‘events’ I might think this correlates.

@nikku, If I were to go your route, ‘roll-your-own’, where do I create the file and put in the code you supplied me with?

I’m a bit off-track here.

Many thanks!

edit: from what I read is that fsevents is only required on Mac (darwin). so the error I receive must be something different…

same issue for new version:

npm i bpmn-js-properties-panel --save
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! Found: bpmn-js@9.0.3
npm ERR! bpmn-js@"^9.0.3" from the root project
npm ERR! Could not resolve dependency:
npm ERR! peer bpmn-js@"^3.x || ^4.x || ^5.x || ^6.x || ^7.x || ^8.x" from bpmn-js-properties-panel@0.46.0
npm ERR! node_modules/bpmn-js-properties-panel
npm ERR! bpmn-js-properties-panel@"*" from the root project

Please do not necrobump old topics. Instead link to this thread from new topic.