Search code examples
angularmodulebpmnng-zorro-antd

Angular 7/8, 1 dependency is interfering with another one, How to avoid the loading of a deep dependency while inside a module that uses it? or embedd


While woeking on the CleanUI Template, this one uses a dependency called ng-zorro, that has a set of imported styles and on screen logic.

This zorro dependency is called on a deep level (a core module, like an app.module), and so the aplication is build upon that.

I now need, somewhere in my app to use BPMN-JS dependency, but these 2 seem to intefere with one another, as when a bpmn component is set up, it lacks many of its features.

I've aislated the problem and know for sure that it's ng-zorro's interference with the other dependency (See code bellow)

With ng-zorro https://stackblitz.com/edit/ng-zorro-antd-start-7va7ry

Without ng-zorro https://stackblitz.com/edit/ng-bpmn

With all of this said, I've updated to angular 8, and the zorro's version for angular 8 as well, trying to separate zorro's dependencies on secondary modules (not much success, CleanUI uses pretty much all of the zorro dependencies).

The only things that ocurr to me is to somehow when the (bpmn) component is loaded, to aislate all of the zorro's dependencies so that they won't interfere with BPMN, but I don't really know how to do that


Solution

  • Silly thing.

    I was supossed to add this to angular.json's styles

    "./node_modules/bpmn-js/dist/assets/bpmn-font/css/bpmn.css",

    This is the kind of things that are suposed to happen automatically as you install the dependency