🐛 [Bug]: el组件在canva可以显示，预览无法显示，查看代码貌似为import导入的问题

[yao521521]

Environment

google与edge

Version

v16.20.2

Version

不知道如何查看最新稳定版

Link to minimal reproduction

https://github.com/opentiny/tiny-engine

Step to reproduce

在canvas添加按钮组件

在预览中查看

样式丢失，且import没有导入的内容

What is expected

预览与canva画布样式一致

What is actually happening

样式丢失且没导入

What is your project name

tiny-engine

Any additional comments (optional)

No response

[Issues-translate-bot]

Bot detected the issue body's language is not English, translate it automatically.

---

Title: 🐛 [Bug]: The el component can be displayed in canvas, but the preview cannot be displayed. The code seems to be an import problem.

[chilingling]

问题判定：物料配置问题
请确保物料配置正确。
从出码结果来看主要有几个问题：

1. ElHeader 的npm 物料配置 destructuring 没有配置为 true

{
  "npm": {
      "package": "element-plus",
      // ...
     "exportName": "ElButton",
     "destructuring": true
   }
}

生成源码：import { ElButton } from 'element-plus'
假如 destructuring 配置为 false 或者不配置，则生成源码为：import ElButton from 'element-plus'，即为不正确的出码。

2. componentsMap 配置不正确。

如果是在 mockServer 中进行测试，请检查 mockServer/src/mock/get/app-center/v1/apps/schema/918.json 文件中的 componentsMap 配置是否包含了需要出码的组件。参考：#527 #503

@yao521521

[Issues-translate-bot]

Bot detected the issue body's language is not English, translate it automatically.

---

Problem determination: material configuration problem
Please ensure that the material configuration is correct.
Judging from the coding results, there are several main problems:

1. ElHeader's npm material configuration destructuring is not configured to true

{
  "npm": {
      "package": "element-plus",
      // ...
     "exportName": "ElButton",
     "destructuring": true
   }
}

Generate source code: import { ElButton } from 'element-plus'
If destructuring is configured as false or not configured, the generated source code is: import ElButton from 'element-plus', which is incorrect code output.

2. componentsMap configuration is incorrect.

If you are testing in mockServer, please check whether the componentsMap configuration in the mockServer/src/mock/get/app-center/v1/apps/schema/918.json file contains the components that need to be decoded. Reference: #527

@yao521521