Elsa 2.8工作流设计器嵌入后活动参数不显示问题求助

问题详情 #

嵌入Elsa 2.8工作流设计器后，设计器界面可正常显示，但选中任意活动（如SendEmail）时，属性标签页无参数加载。开发者控制台抛出错误：

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'config')

嵌入代码如下：

<link rel="stylesheet" href="/Workflow/Content/elsa-workflows-studio/assets/fonts/inter/inter.css">
<link href="/Workflow/Content/elsa-workflows-studio/elsa-workflows-studio.css" rel="stylesheet">
<script src="/Workflow/Content/monaco-editor/min/vs/loader.js"></script>
<script type="module" src="/Workflow/Content/elsa-workflows-studio/elsa-workflows-studio.esm.js"></script>

<elsa-studio-root server-url="https://localhost:5001/" monaco-lib-path="Workflow/Content/monaco-editor/min">
    <elsa-studio-dashboard></elsa-studio-dashboard>
</elsa-studio-root>

排查与解决步骤 #

1. 验证后端API可用性 #

控制台的config未定义错误，核心原因是设计器无法从后端获取活动元数据：

• 确认https://localhost:5001/服务正常启动
• 直接访问https://localhost:5001/elsa/api/activity-descriptors，检查是否返回包含SendEmail在内的活动元数据JSON
• 若存在跨域问题，在后端配置CORS规则，允许前端页面所在域名访问

2. 修正Monaco Editor路径 #

monaco-lib-path需使用正确的路径格式，尝试改为绝对路径（注意开头的斜杠）：

<elsa-studio-root server-url="https://localhost:5001/" monaco-lib-path="/Workflow/Content/monaco-editor/min">
    <elsa-studio-dashboard></elsa-studio-dashboard>
</elsa-studio-root>

3. 确保前后端版本一致 #

嵌入的前端资源（elsa-workflows-studio.esm.js、elsa-workflows-studio.css）必须与后端Elsa 2.8版本完全匹配，版本不兼容会导致元数据解析失败。

4. 确认后端活动包配置 #

若使用SendEmail等扩展活动，需确保后端项目已正确安装对应包并配置：

• 安装NuGet包：Elsa.Activities.Email
• 在Startup.cs中添加活动注册：

services.AddElsa(elsa => 
{
    elsa.AddEmailActivities();
});

内容的提问来源于stack exchange，提问作者VahidNaderi