Sketch json输出到html

Question

我有一个非常简单的问题，有没有人知道有没有一些JS库可以接收Sketch json输出，并以我可以直接在浏览器中呈现的形式返回html (所以不是以html/css文件的形式，而是以代码的形式)？

有https://www.animaapp.com/，但据我所知，他们以文件的形式输出html和css。

我相信Figma或Zeplin都允许导入Sketch文件，所以我想知道有没有什么开源的东西可以用来渲染我们的Sketch文件/json？

Answer 1

它需要努力编写一个程序来转换Sketch到HTML/CSS，我们已经在我们的解决方案中实现了我们自己的一个。但是直接转换的代码是非结构化的，没有响应性，只适用于固定布局。

您可以从https://github.com/mludowise/Sketch-HTML-Export下面的存储库开始

我们花了大约2个月的时间来写一个新的，以获得更好的转换质量。

Answer 2

您可以使用Desech Studio导入Sketch，然后导出为React。

草图导入不会是100%。下面是一个youtube video，它提供了更多细节，但它们的关键是：

• html与网格相对定位
• 导入所有css
• 导入标记为导出的图像和svg

至于React，它使用Facebook的create-react-app作为基础。这是Desech Studio react插件的github repo。最终，您可以派生react插件代码库，并添加您自己的代码库，并使用它来代替官方的react插件。

但我同意@pxCode的观点，这不是一个两次点击导入/导出的过程。这也会涉及到你那端的一些工作。