alibaba/lowcode-engine

TypeError: Cannot read properties of null (reading 'root')

knight-apple opened this issue · 3 comments

Describe the bug (required) / 详细描述 bug(必填)

A clear and concise description of what the bug is. / 请提供清晰且精确的 bug 描述
组件及物料未加载

"TypeError: Cannot read properties of null (reading 'root')
at e (https://alifd.alicdn.com/npm/@alifd/pro-layout@1.0.1-beta.6/build/lowcode/view.js:291:80247)
at e (https://alifd.alicdn.com/npm/@alifd/pro-layout@1.0.1-beta.6/build/lowcode/view.js:291:77172)
at https://alifd.alicdn.com/npm/@alifd/pro-layout@1.0.1-beta.6/build/lowcode/view.js:291:84593
at Bh (https://gw.alipayobjects.com/os/lib/??react/16.14.0/umd/react.production.min.js,react-dom/16.14.0/umd/react-dom.production.min.js:158:456)
at Dj (https://gw.alipayobjects.com/os/lib/??react/16.14.0/umd/react.production.min.js,react-dom/16.14.0/umd/react-dom.production.min.js:194:476)
at unstable_runWithPriority (https://gw.alipayobjects.com/os/lib/??react/16.14.0/umd/react.production.min.js,react-dom/16.14.0/umd/react-dom.production.min.js:25:260)
at Da (https://gw.alipayobjects.com/os/lib/??react/16.14.0/umd/react.production.min.js,react-dom/16.14.0/umd/react-dom.production.min.js:92:280)
at xb (https://gw.alipayobjects.com/os/lib/??react/16.14.0/umd/react.production.min.js,react-dom/16.14.0/umd/react-dom.production.min.js:194:231)
at Te (https://gw.alipayobjects.com/os/lib/??react/16.14.0/umd/react.production.min.js,react-dom/16.14.0/umd/react-dom.production.min.js:178:79)
at https://gw.alipayobjects.com/os/lib/??react/16.14.0/umd/react.production.min.js,react-dom/16.14.0/umd/react-dom.production.min.js:93:68"

进一步排查发现问题在
return window.parent.AliLowCodeEngine.project.currentDocument.root.getDOMNode()
currentDocument为空

To Reproduce (required) / 如何复现 bug?(必填,非常重要)

init(
  document.getElementById('lowcode-work-bench')!,
  {
    // designMode: 'live',
    // locale: 'zh-CN',
    enableCondition: true,
    enableCanvasLock: true,
    // 默认绑定变量
    supportVariableGlobally: true,
    // simulatorUrl 在当 engine-core.js 同一个父路径下时是不需要配置的!!!
    // 这里因为用的是 alifd cdn,在不同 npm 包,engine-core.js 和 react-simulator-renderer.js 是不同路径
    simulatorUrl: [
      'https://alifd.alicdn.com/npm/@alilc/lowcode-react-simulator-renderer@latest/dist/css/react-simulator-renderer.css',
      'https://alifd.alicdn.com/npm/@alilc/lowcode-react-simulator-renderer@latest/dist/js/react-simulator-renderer.js',
    ],
    requestHandlersMap: {
      fetch: createFetchHandler(),
    },
  },
  new Map(),
);

})();
return <div style={style} className={className} id="lowcode-work-bench" />;

本地运行正常,在umi项目中使用雨燕构造发布后出现异常

Steps to reproduce the behavior: / 详细复现步骤:
问题出现页面:http://cone-s9230048453.app-dev.alipay.net/gmwtest?


Expected behavior (required) / 预期行为(必填,非常重要)

正常展示物料及模拟器页面
A clear and concise description of what did you expect to happen. / 请清晰和精确的描述你预期的行为


Screenshots (optional) / bug 截图(可选)

image

Environments (please complete the following information) (required): / 请提供如下信息(必填)

  • AliLowCodeEngine version: [1.0.14] / 低代码引擎版本
  • AliLowCodeEngineExt version: [1.0.14] / 低代码引擎扩展包版本
  • Browser [chrome] / 浏览器版本
  • materials / plugins / tools [demo项目默认物料]

demo项目中的默认物料

没懂问题~

就获取 currentDocument 为空来说,你打印 project 看看是个啥对象~

找到原因了,是因为存在两套AliLowCodeEngine(import和window),如果项目本身不支持externals,就会导致部分插件配置没挂载到正确的project。究其原因是插件实现方式不统一,有用window方式获取project和物料的相关信息,也有用import直接导入的。
解决方案是import一个文件,文件里面配置一个方法,实现 window.AliLowCodeEngine= Import导入的AliLowCodeEngine,然后组件的index.tsx代码里面先运行这段代码,保证在加载文件之前先把两者合并

居然还有不支持externals的情况?