【源码】基于Sketch软件的设计稿前端代码生成工具

项目简介

本项目是由58同城开发并开源的名为Picasso的Sketch插件。它能够自动将Sketch设计稿解析为前端代码，适用于移动端列表、详情页面、运营活动页以及静态页等，提供多种代码生成模式，为前端开发者带来了极大的便利。

项目的主要特性和功能

1. 精准解析：可精确识别Sketch设计稿中的元素，包含颜色、尺寸、布局等详细信息。
2. 多模式代码生成：支持生成普通web代码、web运营版代码、微信小程序代码和ReactNative代码，满足不同开发需求。
3. 灵活配置：能选择对单个画板或所有画板进行代码生成，还可以自定义配置生成参数。
4. 便捷集成：插件安装简单，可轻松集成到Sketch软件中，方便开发者操作。

安装使用步骤

前提条件

确保已下载并安装Sketch软件，版本需大于等于60，可从下载Sketch获取。

安装插件

解压下载的压缩包，双击进行插件安装。

使用插件

1. 打开Sketch软件，使用已安装的插件。
2. 根据需求选择生成模式，如web代码、web运营版、微信小程序或ReactNative代码。
3. 选择要生成代码的画板，可选择单个画板或全部画板。
4. 生成代码后，根据实际项目需求对代码进行调整和优化。

开发步骤

如果需要对插件进行开发，可按以下步骤操作： sh cd picasso npm install npm start npm run build

贡献说明

欢迎参与项目的开发建设和讨论，提交pull request之前请先提[Issue讨论]。

下载地址

点击下载 【提取码: 4003】【解压密码: www.makuang.net】