Imgcook

Imgcook简介

Imgcook（图像大厨）是由阿里巴巴-大淘宝技术-导购和营销产品团队推出的智能设计稿生成前端代码（D2C）的平台。通过智能化技术，将Sketch、PSD或静态图片等视觉稿一键生成高质量的前端代码，包括视图代码、数据字段绑定、组件代码及部分业务逻辑代码。

Imgcook的主要功能

一键还原视觉稿

Imgcook将设计稿转化为前端代码，支持两种方式：
1. 通过Sketch/PSD文件中的设计稿图层信息，使用imgcook插件导出并粘贴至可视化编辑器。
2. 在可视化编辑器中直接上传Sketch/PSD/图片文件，自动解析图层信息并生成代码。

可视化编辑

在imgcook可视化编辑器中，用户可以动态地修改样式、设置循环、修改布局，还可以编写逻辑代码和绑定字段。

生成代码

官方提供常用的DSL（如React/Vue/小程序 DSL），也支持自定义DSL。生成代码后，可点击「导出」，或使用VS code imgcook插件导出，将模块代码文件生成到本地目录进行开发。

Imgcook的应用场景

imgcook适用于多种页面或模块的高度还原，支持的场景包括：
– 移动端细粒度模块开发
– 移动端活动页
– 移动端全页面开发
– PC端 toC 应用
– PC端 toB 应用

不建议在以下场景使用：
– PC端富交互应用
– 游戏场景

如何使用imgcook插件？

1. 登录imgcook账号。
2. 在Figma中，选择Plugins并打开imgcook。
3. 选择任意文件图层组，点击导出。
4. imgcook将提示“导出成功”，并打开编辑器，新建模块即可。

Imgcook是免费的吗？

Imgcook完全免费，支持Figma、Sketch、VSCode等多种插件，轻松将设计稿转换为代码。