Axure SVG 可视化编辑器（VSCode 插件）

在 VSCode / Cursor 里把 Axure 兼容的 SVG 原型当成「可视化画布」直接拖拽微调，⌘S / Ctrl+S 写回同一个文件 —— 不用导出、不用搬运，AI 也能继续读回来改。

安装

在 VS Code 扩展商店搜索 Axure SVG，安装 Axure SVG 可视化编辑器。

如果使用离线包，也可以命令面板 ⌘⇧P / Ctrl+Shift+P → Extensions: Install from VSIX...，选择 axure-svg-editor-0.1.18.vsix 后按提示重载窗口。

用法

• 双击任意 .svg 默认进入可视化编辑器；也可以在资源管理器里右键 → 用 Axure SVG 可视化编辑器打开；
• 或打开 SVG 后，命令面板搜 Axure SVG；
• 编辑：拖拽移动、角点缩放、双击矩形内文字改字、Enter/F2 编辑当前选中文字、框选多选、剪切/复制/粘贴、Option/Alt 拖动复制、Delete/Backspace 删除、🎨取样式/🖌️刷样式、Tab 切换、方向键微调；
• 插入：顶部 矩形 / 文字 / 主要按钮 / 次要按钮 / 文字按钮 可像元件库一样拖到画布落点；右侧 元件库 TAB 可拖拽插入团队常用元件；选中表格内任意元素后可点顶部 下加行 / 右加列，在当前位置扩展模拟表格并自动让位；
• ⌘S / Ctrl+S 保存 → 直接写回当前 .svg，VSCode 标签的小圆点消失即已存盘。

想让 .svg 默认就用它打开：右键标签页 → Reopen Editor With... → 齿轮 → 设为 .svg 默认。想看源码时再 Reopen With → Text Editor。

为什么拖进 Axure 不会翻车

编辑器从数据模型层面只有矩形和文字两种对象，任何操作都生不出 path/circle/group；每次保存前还会自检（扫禁用元素、非标准色值、空文字、0 尺寸框）。所以写回的 SVG 永远是 Axure「转换 SVG 为形状」能转成可编辑原生控件的结构。

兼容

• VS Code ^1.60。
• Cursor 等兼容 VS Code 扩展体系的编辑器可通过 VSIX 离线安装；Open VSX 发布另行处理。