| .. | ||
| index.html | ||
| index1.html | ||
| index2.html | ||
| index2stencil.html | ||
| index_2dia.html | ||
| index_3dia.html | ||
| index_dia.html | ||
| readme.md | ||
index.html , index1.html отображался и результат вычисления и template со значками BPMN
1 Problem
Мы видим, что проблема не в самом коде, а в том, что bpmn-js в нужной версии не экспортирует глобальную переменную. Мы пробовали разные версии, но всё равно сталкиваемся с отсутствием BpmnModeler. Однако в последнем успешном логе (15:22) у нас была успешная загрузка BPMN-диаграммы, но ошибка палитры. Это говорит о том, что импорт через ES-модули работал, но не хватало палитры. В новом коде (15:24) мы опять вернулись к глобальной переменной, которая не определена.
Исходя из этого, давайте примем решение использовать ES-модули, но импортировать именно Modeler из bpmn-js/lib/Modeler, как мы уже делали, и дополнительно добавить модуль палитры. В прошлом варианте с import Modeler from 'bpmn-js/lib/Modeler' и await modeler.importXML у нас была успешная загрузка элементов, но палитра не была доступна из-за ошибки No provider for "palette". Это значит, что в сборке не был включён модуль палитры. Нужно явно импортировать и зарегистрировать палитру.
Я подготовлю код, который:
Импортирует Modeler из bpmn-js/lib/Modeler.
Импортирует PaletteModule и регистрирует его (или использует другой способ). В bpmn-js палитра входит в состав Modeler, но в некоторых сборках она может быть отключена. Альтернативно, можно использовать import BpmnModeler from 'bpmn-js', но в последних версиях это работает. Мы попробуем импортировать напрямую из 'bpmn-js' и посмотрим, будет ли палитра.
На самом деле, в успешном логе (15:22) мы использовали import Modeler from 'bpmn-js'? Там было import BpmnModeler from 'bpmn-js'. Ошибка "No provider for palette" возникла, потому что палитра не была зарегистрирована. Это известная проблема в некоторых сборках esm.sh. Решение – использовать import Modeler from 'bpmn-js/lib/Modeler' и дополнительно импортировать модуль палитры и добавить его через Modeler? Я не уверен.
Упростим: используем версию bpmn-js, которая заведомо включает палитру. Мы уже пробовали 8.7.0, 6.5.1, 4.0.0, 17.11.1. Но ни одна не дала палитру в ES-модулях, а глобальная не определялась. Однако в логе 15:22 у нас была успешная загрузка диаграммы (8 элементов), но ошибка палитры. Значит, сама диаграмма отобразилась? Там было сообщение "BPMN-диаграмма загружена успешно", но палитра не работала. Если диаграмма отобразилась, то это уже прогресс. Давайте сделаем так, чтобы палитра работала.
Я предлагаю использовать последнюю версию bpmn-js через CDN как глобальную, но с проверкой, что BpmnModeler действительно определён. Если нет – загружать скрипт через другой источник. Также можно попробовать другой CDN, например, unpkg.
Попробуем загрузить bpmn-js из unpkg вместо esm.sh. И используем глобальную переменную. Если не поможет, переключимся на использование Modeler из bpmn-js с явным добавлением модулей.
2 Modeler vs Viewer
Мы видим, что лог показывает ошибку: "No provider for 'palette'! (Resolving: palette)". Это означает, что в используемой версии bpmn-js нет провайдера для палитры. Причина в том, что мы импортировали просто BpmnModeler из bpmn-js, но, видимо, в версии 10.0.0 экспорт по умолчанию — это Viewer, а не Modeler. Нам нужно явно импортировать Modeler из bpmn-js/lib/Modeler.
Исправим импорт и добавим явное подключение палитры. Также укажем версию 10.0.0, но с правильным импортом.