必须通过ai生成原型/应用项目，在预览界面左上角点击</>图标切换至代码视图，右上角确认显示“vue”或“react”标签后，方可复制或下载可运行的前端工程代码。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
想在墨刀里直接拿到可运行的Vue或React代码，而不是只看一张静态原型图，必须找到AI生成代码功能的准确入口——它不在画布右键菜单里，也不藏在「导出」子选项中，而是在AI完成界面生成后的特定视图切换位置。
确认已进入AI生成的原型/应用项目
打开墨刀官网并登录账号→点击「新建项目」→选择「AI生成原型」或「AI生成应用」模板→输入需求描述（如“后台管理首页，含侧边导航、数据看板和用户列表”）→等待生成完成。只有在这个流程下产出的项目，才具备代码生成功能。
普通手动创建的空白项目、上传的Figma/Sketch文件、或用「白板」类型启动的AI内容，【均不支持代码生成】。
在预览界面左上角点击 > 图标
生成完成后，自动进入页面预览模式。将鼠标移到画布左上角，会出现一个灰色的「>」符号图标，点击它。
这一步不能跳过：未点击该图标前，你看到的只是视觉稿；点击后，整个画布会切换为结构化代码视图，左侧显示文件树（components/pages/assets等），右侧显示高亮语法的Vue或React源码。
检查右上角是否显示「Vue」或「React」标签
代码视图顶部工具栏右侧，会明确标注当前代码类型，例如「Vue 3 + TypeScript」或「React 18 + Vite」。
若此处显示「HTML」或无框架标识，说明你当前使用的是基础原型生成模式，需返回上一步，在AI生成前主动选择输出类型：在输入需求后、点击「生成」前，先点「高级选项」→「代码框架」→勾选「Vue」或「React」→再生成。
注意：【生成后无法更改框架类型】，选错只能重新走一遍AI生成流程。
从代码视图直接复制或下载
代码加载完毕后，点击右上角「复制全部代码」按钮，即可一键复制整个项目结构到剪贴板；或点击「下载ZIP」，获取含package.json、vite.config.ts、组件文件等的完整工程包。
下载的ZIP解压后可直接用VS Code打开，执行npm install → npm run dev即可本地预览——它不是截图，是真实可运行的前端工程起点。
