Imgcook（图像大厨）是一个由阿里巴巴-大淘宝技术-导购和营销产品团队推出的平台，旨在智能生成前端代码（D2C，Design to Code）。该平台专注于将Sketch、PSD、静态图片等形式的视觉稿转换为可维护的前端代码，其中包括视图代码、数据字段绑定、组件代码以及部分业务逻辑代码等。
Imgcook的主要特性包括：
快速恢复视觉草图
将设计稿中的信息导出到 imgcook 可视化编辑器，可以通过两种方法还原为代码：
- 方法一：打开 Sketch/PSD 文件，使用已安装的 imgcook 插件将设计文件中的图层数据导出，然后粘贴到可视化编辑器中进行编辑。
- 第二个选项：可以直接在可视化编辑器中上传“导入”Sketch/PSD/图片文件，imgcook会解析图层信息并将其直接恢复到编辑器中。
可视化编辑
用户可以利用 imgcook 的可视化编辑器对视图进行编辑，比如支持动态表达式样式、设置循环、修改布局。同时还能够编写逻辑代码、绑定字段等操作。
生成代码
官方提供了常用的 DSL（包括React/Vue/小程序 DSL等），您可以通过点击下拉列表切换使用其他 DSL。如果您有特殊需求，也可以自定义 DSL。
确认代码后，您可以点击“导出”按钮，也可以使用VS Code的imgcook插件来进行导出。这种方式可以将整个模块的代码文件生成到指定目录，便于继续在VS Code中开发整个项目。导出的代码会保存到本地文件中，图片会以相对路径的形式存放在images文件夹内。
Imgcook的使用情境
目前imgcook能够准确还原各类页面或模块的高度，您可根据具体场景需求来决定是否使用imgcook。
- 移动端开发中的细分模块应用场景 - 强烈推荐
- 移动版活动页面 - 强烈推荐
- 在移动端进行整个页面的开发 - 值得推荐
- PC端的ToC应用 - 推荐
- 桌面应用程序
- 不建议使用富交互应用的 PC 端。
- 游戏场景 - 不建议
使用imgcook插件的方法是什么？
请确认您已经成功登录到imgcook账户。
打开 Figma 软件，在插件中选择 imgcook，然后会弹出一个新的导出窗口。
请选中任意文件夹中的图层组，接着点击“导出”。当弹出“导出成功，已经复制到剪贴板！”提示后，点击“转到粘贴”以进行还原。
Imgcook会在一个新的浏览器选项卡中打开编辑器。 将内容粘贴并恢复到“ ctrl + v”编辑器中，然后保存为模块即可。
Imgcook是免费使用的吗？
Imgcook是免费的，用户可以利用它提供的Figma、Sketch、VSCode等插件，将设计稿免费转换为代码。
