alibaba / alibaba/lowcode-engine

[@alilc/lowcode-material-parser] 生成 @mantine/core 中组件,sx 属性生成类型错误

Open
#1,895 1 comment 0 reactions 1 assignee Claimed by @akirakai View on GitHub
Dominant language
TypeScript
Stars
15.9k
Forks
2.7k
PR merge metrics
No merged PRs in 30d

Description

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

```
import {Box} from "@mantine/core";

export const MantineBox = Box

MantineBox.displayName = 'MantineBox';

```

对这样的组件进行生成定义,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?(必填,非常重要)**
1. 创建 Test.tsx
```
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 加载

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.