vue3 bpmn-js

Vue3和bpmn-js的相关依赖可以通过引入`markRaw`函数和相应的CSS文件来实现。在Vue组件中，可以使用`import { markRaw } from 'vue';`来引入`markRaw`函数，并使用`import 'bpmn-js/dist/assets/diagram-js.css';`和`import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css';`来引入相关的CSS文件。[1]

在Vue组件的`data`方法中，可以初始化`containerEl`和`bpmnModeler`两个变量，并在`mounted`生命周期钩子函数中调用`init`方法来初始化流程图。在`init`方法中，可以使用`markRaw`函数去除双向绑定作用域，并创建一个`BpmnModeler`实例，将其绑定到`containerEl`上。然后可以调用`createDiagram`方法来创建流程图，并使用`zoom`方法将图形缩放到适合视口的大小。[2]

另外一种方法是在方法中直接定义`bpmnModeler`变量，而不在`data`中定义。可以使用`const bpmnModeler = new BpmnModeler({ container: this.containerEl });`来创建`BpmnModeler`实例，并在`createDiagram`方法中创建流程图并进行缩放操作。[3]

总之，以上是在Vue3中使用bpmn-js的一些示例代码，可以根据具体需求选择适合的方式来初始化和使用bpmn-js。