The properties panel does not display

grunt.js

‘use strict’;

module.exports = function(grunt) {

// project configuration
grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    browserify: {

        // create customized bower bundle
        bower: {
            files: {
                'dist/bpmn-viewer-custom.js': [ 'index.js' ]
            },
            options: {
                browserifyOptions: {
                    standalone: 'BpmnJS',
                    insertGlobalVars: {
                        process: function () {
                            return 'undefined';
                        },
                        Buffer: function () {
                            return 'undefined';
                        }
                    }
                }
            }
        }
    }
});

grunt.loadNpmTasks('grunt-browserify');

grunt.registerTask('default', [ 'browserify:bower' ]);

};
app.js

// get bpmn-js
var BpmnViewer = require(‘bpmn-js/lib/Modeler’);
// load additional modules
var additionalModules = [
require(‘bpmn-js-properties-panel’),
require(‘bpmn-js-properties-panel/lib/provider/bpmn’),
require(‘bpmn-js-properties-panel/lib/provider/camunda’)
];

// add additional (default!) modules to bpmn-js
BpmnViewer.prototype._modules = BpmnViewer.prototype._modules.concat(additionalModules);

// export
module.exports = BpmnViewer;

html
<!doctype html>

html, body, #canvas { height: 100% } bpmn-js bower example - bpmn-js-examples

The properties panel does not display

Cool Grunt config file. Mind explaining what you’re trying to do and where exactly you’re stuck?

Hello,

I am using bpmn-js modeler by adding webjar of bpmn-js. I want to add properties panel to it. My project is not in nodejs environment. I can only use properties panel if it available as a single javascript file or a webjar of it. How do I achieve it ?
Please let me know.
Relate the question

You can achieve that by bundling the properties panel.

index.js
‘use strict’;
var BpmnViewer = window.BpmnJS;

var viewer = new BpmnViewer({
container: ‘#canvas’,
propertiesPanel: {
parent: ‘#properties
}
});

No effect, no display

In the future, please

  1. Provide more context
  2. Format your code

You forgot to add the actual properties panel. Here’s a working example: https://codesandbox.io/s/bpmn-js-with-properties-panel-senuf