Open StringKe opened 1 year ago
import {Box} from "@mantine/core"; export const MantineBox = Box MantineBox.displayName = 'MantineBox';
对这样的组件进行生成定义,https://mantine.dev/styles/sx/
mantine 中所有组件默认拥有这个 sx 属性类型为React.CSSProperties 或者 (theme) => React.CSSProperties
React.CSSProperties
(theme) => React.CSSProperties
通过工具生成出来的 sx 定义拥有三个类型定义,并且变成了数组。
生成后的类型会在 lowcode-engine 中遇到 Cannot read properties of undefined (reading 'map') 错误
Cannot read properties of undefined (reading 'map')
错误产生代码行为
https://github.com/alibaba/lowcode-engine/blob/779edf783bac1ef71668fb74eaba44527c99a0f5/packages/editor-skeleton/src/transducers/parse-props.ts#L154
import {Box} from "@mantine/core";
export const MantineBox = Box
MantineBox.displayName = 'MantineBox';
2. 创建 gen.js
const parse = require('@alilc/lowcode-material-parser').default; const fs = require("fs")
(async () => { const options = { entry: "./Test.tsx", };
const actual = await parse(options); fs.writeFileSync("./data.json", JSON.stringify(actual, null, 2))
})();
## **Expected behavior (required)** / **预期行为(必填,非常重要)** 生成正确的类型 ## **Screenshots (optional)** / **bug 截图(可选)** ![CleanShot 2023-04-17 at 19 04 59@2x](https://user-images.githubusercontent.com/31089228/232466598-223e269e-2b8c-4b70-8e8e-07be5e7fef37.png) ![CleanShot 2023-04-17 at 19 05 08@2x](https://user-images.githubusercontent.com/31089228/232466643-784cdd9e-7279-41fa-9103-ec3cf0c910de.png) ## **Environments (please complete the following information) (required):** / **请提供如下信息(必填)** - @alilc/lowcode-material-parser@1.0.4-beta.0 > (this information can be collected via [the manual plugin](https://img.alicdn.com/imgextra/i1/O1CN0115zonY1IsgbkZ2ir7_!!6000000000949-2-tps-3066-1650.png) / 版本信息可[通过低代码用户手册插件收集](https://img.alicdn.com/imgextra/i1/O1CN0115zonY1IsgbkZ2ir7_!!6000000000949-2-tps-3066-1650.png)) ## **Additional context (optional)** / **更多额外信息(可选)** Any other context of the problem here. / 可以追加更多的额外信息,帮助定位问题 生成后的类型包含 ```json { "type": "objectOf", "value": "oneOfType" }
这样的定义似乎是有问题的,无法被 lowcode 加载
看了下文档,https://mantine.dev/styles/sx/
看起来sx就是会有对象、函数、数组三种类型,入料模块并不会识别你的意图(也许就是想要使用函数),目前的结果是正确的,问题在于搭建态不识别,可以在自动生成之后进行人工微调,或者自定义interface,对sx的类型进行覆盖。
Describe the bug (required) / 详细描述 bug(必填)
对这样的组件进行生成定义,https://mantine.dev/styles/sx/
mantine 中所有组件默认拥有这个 sx 属性类型为
React.CSSProperties
或者(theme) => React.CSSProperties
通过工具生成出来的 sx 定义拥有三个类型定义,并且变成了数组。
生成后的类型会在 lowcode-engine 中遇到
Cannot read properties of undefined (reading 'map')
错误错误产生代码行为
https://github.com/alibaba/lowcode-engine/blob/779edf783bac1ef71668fb74eaba44527c99a0f5/packages/editor-skeleton/src/transducers/parse-props.ts#L154
To Reproduce (required) / 如何复现 bug?(必填,非常重要)
export const MantineBox = Box
MantineBox.displayName = 'MantineBox';
const parse = require('@alilc/lowcode-material-parser').default; const fs = require("fs")
(async () => { const options = { entry: "./Test.tsx", };
})();
这样的定义似乎是有问题的,无法被 lowcode 加载