如何将Adobe XD转换为HTML CSS（VUE）？

Question

我想使用vue.js制作一个单页应用程序。我得到了像这样的https://coreui.io/vue/参考。我的同事使用Adobe XD制作了原型。我的工作是将其转换为html css，它将使其起作用并连接到api。我可以自动转换吗？还是我必须手动转换它。如果无法自动转换，是否有模板可以帮助我转换为html CSS？我的CSS很弱。所以我需要参考。这样我就可以快速转换

请帮我几个选择。谢谢

Answer 1

我认为您必须手动进行转换 但是，社区之前已经多次要求导出到HTML / CSS / JS功能，而Adobe团队目前正在对此进行操作（请检查this和此）。

我想您也可以使用名为“ Web Export”的插件。

为了使用插件，

确保您具有最新版本的XD

1. 转到插件

2. 发现插件

3. 搜索“网络导出”

4. 单击“安装”

Answer 2

最直接的选择是手动编写 html/css，然后手动将其与 vue 组件集成。

但是既然你说你对css不是那么精通，你可以使用Desech Studio导入AdobeXD文件，然后做一些调整，在Desech Studio中安装vue插件，然后它将你的html/css代码与vue集成直接。

查看位于 https://github.com/desech/studio-vue 的 github 存储库，了解插件的提示和限制。