imgcook初探

1.官方网站上看文档

官方网站 https://imgcook.taobao.org/

2.下载sketch的插件和demo

3.下载sketch，打开demo，导出demo

4.登录网站，粘贴代码

5.编辑保存模块

6.本地安装imgcook-cli,下载代码到本地

编辑页面示例：

左边选择节点，中间显示模块，右边编辑节点具体设置

imgcook编辑页面示例

生成代码示例：

imgcook生成代码示例

生成代码问题：

1.非嵌套类名，例如bd最好为box-bd

imgcook非嵌套类名

2.多余样式

imgcook多余样式

3.多余嵌套

imgcook多余嵌套

response的区别是把px变成了vw

imgcook的response区别

rem的区别是把px变成了rem，但是字体没有变而且有错误的转换，所以实际样式会有问题

imgcook的rem

imgcook的rem错误

总结：

imgcook生成的代码会有一些问题，但是简单的不涉及交互的页面还是可以通过imgcook+手动调整代码实现

对于新同学通过学习生成代码的结构和基础的样式有利于基础学习，通过手动调整代码有利于进一步规范和提高开发页面结构和页面样式的能力