06｜Vue 2 工具链维护

Vue 2.6/2.7 的实际运行差异、编译器配对与初次诊断见第十章版本与工具链。本篇继续处理构建产物与双链迁移合同，先具备可重复的旧环境，再比较新链。

第九章 / 06。目标：先让旧构建可重放，再决定升级、迁移或隔离；不要在一次提交里更换所有地基。

旧代码的真实合同藏在哪里

Vue CLI/webpack 项目的行为不只来自源码，还来自锁文件、Node 版本、vue-loader 与模板编译器配对、Babel targets、环境变量注入、alias、CSS loader 顺序和 public path。迁移前先产出清单：

输入：Node/包管理器版本、lockfile、环境变量 schema
变换：Babel、vue-loader、宏/alias、CSS/PostCSS
输出：entry/chunk 名、public path、polyfill、source map
运行：支持浏览器、路由 base、代理与部署 headers
验证：登录/路由/表单烟雾、产物大小与错误回溯

只保存 package.json 不足以重放；同一 semver 范围在不同日期解析出的依赖图可能不同。CI 使用干净环境和锁文件安装，并保存构建工具版本与产物清单。

双链迁移实验

选一个无副作用页面作为切片，让旧链和新链读取同一 fixture，比较：

• 可见 DOM 与关键交互，而非逐字 HTML；
• API 请求方法、URL、headers 与错误处理；
• CSS/资源 URL、动态 import 与路由刷新；
• 目标浏览器中的语法和 polyfill；
• source map 是否映射到同一源码 release。

先锁行为回归测试，再只迁一个维度。例如先把类型检查从 transform 线程拆到独立 vue-tsc，或先迁一个页面入口；不要同时升级 Vue 主版本、router、状态库、CSS 方案与测试框架，否则失败无法归因。

依赖与安全边界

Vue 2 已属于遗留维护场景。是否继续运行不是单纯技术偏好：应记录已知漏洞暴露、浏览器支持、供应链可获得性、业务下线时间和迁移成本。无法立即迁移时，把旧链隔离在固定 Node/容器与独立部署中，限制新增功能，并保持关键安全修复渠道。

练习：迁移前后产物合同

设计 artifact-contract.json，包含 routes、requiredAssets、forbiddenGlobals、maxEntryBytes（由当前基线决定）与 supportedBrowsers。先把各构建器 manifest 转成 { routes: string[], assets: string[], entries: { name, bytes, code }[] }，本练习直接使用该标准化输入（不要求凭未讲授的构建器格式推断）。写检查脚本验证新旧两份 manifest：必需路由/资源都存在、产物不引用禁止全局、超预算时失败并输出差值。不要把示例字节数当全项目通用门槛。

参考答案：第 9 章第 06 题。