antv x6使用记录

最近要用到自定义流程图， 找了很多插件，antvX6更符合场景，还有文档。

项目环境： Vue3 + vite + ts + less + Arco design
antv x6 版本： 安装的最新的：

"@antv/x6": "^2.5.1",
"@antv/x6-plugin-stencil": "^2.0.2", // 提供了一个类似侧边栏的 UI 组件

这里有两个坑：

1. 页面是包在tabs里面的，每个tabs里都会引用流程图，根据id='container’查找，这里必须设置<a-tabs destroy-on-hide> 未激活的tab需要销毁，否则流程图只会加载到第一个id='container’下。
2. 引入stencil之后，控制台报错：

TypeError: Cannot read properties of undefined (reading 'ToolItem')

试了很多方法，在vite.config.js里加一行配置：

resolve: {
    alias: {
      '@antv/x6-plugin-stencil': path.resolve('./node_modules/@antv/x6-plugin-stencil/lib/index.js'),
    }
  },`