Figma设计稿直接转Flutter代码方案（一）

使用Plugin导出的代码存在以下缺陷：

• 基于 Stack + Positioned 布局
• 嵌套层次多
• 宽高写死，不是响应式
• 和业务代码差距很大

Figma转代码的三个MCP

• Figma Remote MCP：https://help.figma.com/hc/en-us/articles/32132100833559-Guide-to-the-Figma-MCP-server
• Figma Desktop MCP：https://help.figma.com/hc/en-us/articles/32132100833559-Guide-to-the-Figma-MCP-server
• Framelink_Figma_MCP：https://www.framelink.ai/ https://github.com/GLips/Figma-Context-MCP
  • 第三方
  • 需要配置Key

总结

• 使用MCP实现的代码，AI会有自己的想法，会自动拆分代码组件化
• 使用插件导出的代码，基本上可以100%还原设计稿，但是代码可读性性太差了，没有很好的布局范式，自己也是需要修改很多