
Vize Rust 架构完全拆解Armature 解析器与 20 个艺术命名 Crate 如何共享一个 Vue AST【免费下载链接】vizeBlazing fast Vue.js Toolchain. Compiler, Linter, Type Checker, Formatter, LSP, Story System, Editor Extensions. This already passed 10k test suites, includes real world E2E.项目地址: https://gitcode.com/gh_mirrors/viz/vizeVize是一套 blazing fast极速的Vue.js Rust 工具链集成了 Vue 编译器、Linter、Type Checker、Formatter、LSP 与组件 Story 系统已通过 10000 测试套件含真实项目 E2E。本文将拆解它的 Rust 架构Armature 解析器如何与 20 个“艺术命名”的 crate 共享同一份 AST让编译、检查、格式化各模块不再重复解析同一个.vue文件。一张图看懂五层架构与“共享 AST”不变式如上图源自官方架构图所示Vize 的 Rust 工作区分为五层层职责代表 crateApplications用户入口Vite 插件、CLI、LSP、Musea 画廊、Playgroundvize、vize_maestroTools独立开发者工具vize_patinaLint、vize_glyph格式化、vize_canon类型检查Compiler (Atelier)编译器家族SFC 编排 DOM/Vapor/SSR 三后端vize_atelier_*六个 crateCore语言核心解析器、AST、内存分配器vize_armature、vize_relief、vize_cartonBindings桥接 JS 世界WASM / Node.js / NAPI-rsvize_vitrine整个架构最重要的一条不变式是解析器Armature、ASTRelief、语义分析Croquis永远共享编译器后端和开发者工具只是围绕这个共享语言模型可替换的“工作室”。这意味着当你运行vize fmt、vize lint、vize check时模板只被解析一次后续所有工具复用同一棵树。Armature骨架Vue 模板解析器的入口vize_armature负责把 Vue 模板源码词法化tokenize并解析为 AST是整个工作区所有下游工具的唯一解析入口。它的“骨架”隐喻非常贴切骨架撑起雕像解析器撑起整条流水线。它的三个能力值得新手重点关注Vue 感知的 HTML 词法器原生处理v-if、v-for、v-bind等指令与{{ }}插值表达式而不是先按普通 HTML 解析再打补丁共享的解析入口parse、parse_with_options、Parser等 API 被编译器、Linter、Formatter、语言服务器共同调用⚙️解析选项与 AST 同源解析器选项直接由vize_relief重导出保证“解析契约”与“AST 定义”永远一致。核心源码入口在 crates/vize_armature/src/parser.rs 与 crates/vize_armature/src/tokenizer.rs模块说明见 crates/vize_armature/README.md。Relief浮雕共享 AST 的唯一定义地AST 不能散落在各 crate 里各写一套否则“共享”无从谈起。vize_relief就是这座“浮雕底座”——它定义了全工作区唯一的 Vue 模板 AST 节点、编译器错误类型和编译选项并提供对 arena 分配友好的数据结构与 serde 序列化支持。关键设计点Arena 化内存布局AST 节点由vize_carton提供的 arena 分配器统一分配整棵树可以一次性释放遍历零碎片源码位置Source Range内建每个节点携带精确位置信息Lint 报告、格式化、LSP 跳转都依赖它无需二次计算serde 支持同一棵树可以直接序列化为 JSON供 Inspector、编辑器扩展和 CI 报告消费。定义位置crates/vize_relief/src/relief.rs、错误类型见 crates/vize_relief/src/errors.rs。Croquis速写语义分析层语法树只是“骨架”语义才是工具的燃料。vize_croquis在共享 AST 上做语义分析作用域追踪scope tracking模板中{{ user.name }}的user到底绑定了 script 里的谁绑定元数据binding metadata编译器据此判断哪些变量需要响应式、哪些是 props响应式与宏分析defineProps、vapor宏等为vize_canon的虚拟 TypeScript 生成提供输入。源码见 crates/vize_croquis/README.md跨文件语义分析由姊妹 cratevize_croquis_cf提供可选开启。20 个艺术命名 Crate 全景清单Vize 用“艺术工作室”的词汇给每个 crate 命名读源码时先记住这张对照表心智负担会小很多Crate隐喻职责vize_carton纸盒共享基础arena 分配器、紧凑字符串、哈希集合、DOM 标签表、i18nvize_relief浮雕共享 AST、编译器错误与选项vize_armature骨架Vue 模板词法器 解析器vize_croquis速写语义分析、作用域、绑定元数据vize_croquis_cf速写·跨卷跨文件语义分析与项目级诊断vize_atelier_core工作室·核心共享 transform lane 与代码生成基础设施vize_atelier_dom工作室·DOMVDOM 模板编译vize_atelier_vapor工作室·VaporVapor 模式编译vize_atelier_ssr工作室·SSR服务端渲染编译vize_atelier_sfc工作室·SFC.vue三块template/script/style编排vize_atelier_jsx工作室·JSXJSX/TSX 解析与降级loweringvize_patina包浆Vue SFC Linter内置 6 套预设vize_glyph字形Vue SFC 格式化器vize_canon典范Vue 感知类型检查 虚拟 TS 生成vize_maestro指挥家Language Server ProtocolLSP实现vize_musea美术馆组件 Art 文件解析、文档/色板生成、VRTvize_curator策展人Inspector 载荷、图/差异元数据、Profile 报告仅本地vize_fresco湿壁画TUI 终端界面基础vize_vitrine橱窗NAPI / WASM 绑定面向 JS 消费方vize门面Rust 原生 CLIbuild/fmt/lint/check/lsp 全工作区重导出完整说明见 docs/content/architecture/crates.md架构总览见 docs/content/architecture/overview.md。一个 .vue 文件的旅程Lane车道如何复用同一棵 AST官方将数据流抽象为“lane车道”每个 crate 只负责一段可复用的车道Source一个包含template、script、style的.vue文件Armature词法化 → 解析为结构化 ASTReliefAST 落地成为所有下游阶段的唯一中间表示消除重复解析Croquis在 AST 上叠加作用域、绑定、响应式语义VIR 输出Atelier按需分叉——VDOM / Vapor / SSR 三个后端各取所需输出最终 JS。同一棵 AST 还分叉给三条“工具车道”vize_patina做 Lint 规则遍历、vize_glyph做格式化、vize_canon生成虚拟 TypeScript 做类型检查。这正是“共享一个 AST”的工程收益所在。新手阅读源码的最快路径如果你想亲手验证这套架构建议按“依赖倒序”阅读五步即可跑通心智模型看 Cargo.toml20 个 workspace 成员与 OXC 固定版本一目了然理解“谁依赖谁”读 crates/vize_relief/src/lib.rsAST 与编译器选项的公共 API读 crates/vize_armature/README.md找到parse入口跑一个小模板对照 docs/content/architecture/overview.md 中的关系图确认 Parser → AST → Semantic → Atelier 的主干打开 crates/vize/README.md看 CLI 子命令build/fmt/lint/check/lsp分别映射到哪些 crate。总结Vize 的 Rust 架构可以浓缩为一句话Armature 负责“读懂” VueRelief 负责“记牢”它Croquis 负责“理解”它20 个艺术命名 crate 则在这份共享 AST 之上各守一段车道。解析一次、处处复用既是它“blazing fast”的性能来源也是编译器、Linter、Formatter、Type Checker 与 LSP 能在行为上保持严格一致的根本原因——值得正在学习 Rust 编译器/语言工具项目的开发者重点参考。【免费下载链接】vizeBlazing fast Vue.js Toolchain. Compiler, Linter, Type Checker, Formatter, LSP, Story System, Editor Extensions. This already passed 10k test suites, includes real world E2E.项目地址: https://gitcode.com/gh_mirrors/viz/vize创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考