用于已有 Arco Design Vue 工程的代码整理与中文业务界面优化,覆盖组件复用、ESLint、主题、列表表单、请求状态、权限与页面验收。附官方接口依据及版本边界。
## 任务目标 请基于 Arco Design Vue,对指定 Vue 工程或模块完成工程标准化、代码整理和界面优化。直接修改并交付可运行的代码,保持真实业务流程与数据含义,完成检查和页面验收,不要只给审查意见、设计建议或静态效果图。 在现有授权范围内完成实际改动和验证;缺少外部条件时先完成可独立实现的部分,不能只停留在计划。 ## 输入信息(选填) 两项均可留空,也可直接用一句话说明目标并附上已有资料。无需自行整理版本、配置或完整需求表;能读取的内容由执行者补齐。 改造目标:从当前对话、选定文件和改动关联路由识别待整理页面;未指定具体问题时,先检查一个代表性业务页面的结构、Arco 用法与中文布局,再在能够确认的局部范围实施。 工程或页面资料:读取当前已确认工作区的 Vue 工程、页面、接口和现有设计配置;已有截图或访问入口作为界面比对资料,不要求重复填写版本和组件清单。 ## 信息不完整时 先使用本次对话中已经说明的信息;用户留空、写“暂无/不清楚”或未替换输入标记,都按缺失处理,不当作真实路径、参数或业务值。已能从资料确定的内容不重复询问,不编造文件、日志、接口、业务值或执行结果。在用户已授权的范围内读取相关工程和材料,不为补齐输入擅自扩大操作范围。 ### 优先确认 - 检查分支、已有改动、package.json、锁文件和构建入口,确认 Vue、Arco、Node、JS/TS 及包管理器。 - 沿路由追踪查询、编辑、权限、字典与请求封装,识别重复组件和状态所有者。 - 读取已安装 Arco 类型及样式入口,核对 ConfigProvider、Table、Form、Modal 的属性、事件、校验返回值和主题机制。 - 查找现有布局、语言、字号、间距、ESLint、Prettier 和 EditorConfig 约定及可执行检查脚本。 ### 可采用的默认处理 - 沿用实际技术选型和 Arco 版本,仅整理本次页面及直接关联的公共能力;不自动迁移 Vue 2 或混合组件库,不整仓格式化。 - 无设计约定时采用正文已有的桌面政企业务界面默认值,兼顾窄屏;默认不新增深色模式、统计指标和装饰性文案。 - 保留现有字段、权限、字典码和操作顺序;未知字典值可识别地显示原值,按 Arco Vue 的真实 API 实现表单和弹窗,不套用 Ant Design。 ### 必须有依据的事项 - 同一字段的金额、时区、状态码或权限规则在页面与接口之间相互矛盾,且本次改造必须选择其中一种才能保存正确业务数据。 - 目标要求必须使用 Arco Vue,但当前工程不支持该库且完成目标需要主版本迁移或更换组件库;该迁移范围不能自行决定。 只有缺口会改变业务结果、权限边界或关键实现,且无法从现有资料确认时,才集中提出最多 3 个关键问题;说明影响,并继续完成不依赖答案的部分。一般命名、排版和可逆实现细节按现有约定决定,不逐项等待确认。 ### 资料仍不足时的交付 - 只有截图时交付页面分组、主次操作、中文排版和状态反馈的具体调整方案,明确交互及接口尚未验证。 - 没有工程时给出 Arco Vue 组件职责、数据契约核对表和最小接入示意,不创建未经要求的新系统或声称改造已完成。 ## 执行要求 ### 先明确工程现状与改造边界 检查当前分支、未提交改动、package.json、锁文件、构建配置、路由、权限、接口封装、状态管理和组件目录,列出本次涉及的页面及主要问题。保留无关改动,不以格式化为由改写全仓库。 核实 Node、Vue、TypeScript、Arco、构建工具与包管理器版本,沿用已有锁文件和安装方式。Arco Design Vue 的包名是 @arco-design/web-vue,适用于 Vue 3;不得混用 @arco-design/web-react 或其他组件库的接口。发现 Vue 2、混合组件库或版本不兼容时,先说明迁移影响,不擅自升级主版本或全量替换。 已有工程逐步整理;只有明确要求新建时才创建工程。未明确提供仓库或业务资料时,先检查当前可访问工程;仍缺资料则完成可落实的结构与页面方案,不编造已完成的改造。可从代码确认的事项自行确认,只提出阻塞业务判断的问题。 不擅自修改接口字段、权限规则、审批顺序、统计口径、路由地址、持久化键和对外事件。必要的契约调整必须说明影响并同步处理调用方。 ### 统一代码结构与复用方式 沿用工程既有分层,将页面编排、业务组件、可复用组件、组合式函数、接口请求、类型、字典和样式放在职责清楚的位置。缺少约定时,可使用 views、components、composables、api、types、constants、styles;不要为了目录形式拆出大量空文件。 新建 Vue 3 组件优先遵循项目的 Composition API 与 script setup 用法。声明清楚的 props、emits 和接口类型,禁止直接修改 props、用 any 掩盖类型问题、无依据的非空断言以及跨层读取组件内部状态。JS 工程按范围补足必要类型说明,不强行一次性迁移整个工程。 先查找已有能力,再抽取组件、composable 或纯函数。至少有明确复用场景或独立业务职责时才抽取;不要重复封装无业务增益的 Arco 按钮、输入框,也不要制造用几十个开关控制所有页面的万能表格、万能弹窗。 纯格式化、数据转换可放 util;含响应式状态、生命周期或副作用的逻辑放 composable;请求统一经过现有请求层。组件不得直接拼接 SQL 或持有服务端密钥。 状态码、权限码、业务类型和单位集中定义。以后端字典为准的值使用同一数据来源,保留 code 与 label 的对应关系,不在多处复制数字和中文判断。未知、历史或停用字典值保留可识别的原值,不默认替换成第一项。 删除本次范围内确认无用的导入、变量、分支、样式和旧代码。查清动态路由、自动注册及反射式引用后再删除文件。禁止保留注释掉的整段旧实现和没有使用场景的兜底层。 ### 统一格式、检查和注释 以现有 ESLint、Prettier、EditorConfig 为准;缺少规则时默认 UTF-8、LF、2 空格缩进、文件末尾换行,统一引号、分号、属性换行和导入顺序。不要混用 Tab 与空格,不做对齐式空格堆砌。 按工程实际 ESLint 版本配置 Vue 与 TypeScript 支持,避免同时引入互相冲突的旧配置和 flat config。格式化规则与代码质量规则分工清楚,不堆叠重复插件,不用全局关闭规则、ts-ignore 或大范围 disable 消除报错。 提供与当前包管理器相符的 lint、必要的类型检查和 build 命令;已有脚本可复用就不另造一套。TS 工程检查 Vue 单文件组件类型,使用兼容版本的 vue-tsc 等现有工具。说明实际运行命令,不把示例命令当作运行结果。 名称表达业务含义。注释用简明中文解释业务约束、兼容原因和复杂计算;公共方法说明必要参数、返回值与边界。不要给每一行加翻译式注释,不写装饰性分隔线、口号或与产品无关的说明。 ### 按 Arco Vue 实际能力接入组件与主题 优先阅读已安装版本的类型声明与对应版本官方文档。不能因为同样使用 a- 前缀就照搬 Ant Design Vue 的 props、事件、插槽或主题配置。组件名称、图标入口、按需加载与样式加载方式都必须能在当前工程中验证。 全量引入样式的官方入口是 @arco-design/web-vue/dist/arco.css;按需方案应核实组件样式和浮层样式均已加载,不重复引入整套样式。中文语言在统一入口配置,ConfigProvider 的 locale 使用语言包对象,例如从 @arco-design/web-vue/es/locale/lang/zh-cn 导入,而不是直接传入语言字符串。全局尺寸按当前版本支持的 mini、small、medium、large 统一选择,并检查局部覆盖。 优先使用当前版本真实存在的主题变量或项目设计变量,集中管理主色、背景、边框、文本、间距与圆角。采用 Less 变量定制时必须匹配 Less 样式与构建配置,不能仅加载预编译 CSS 后期待编译变量生效。不要复制其他组件库的主题 token API。 业务样式优先限定在业务容器和语义类名内,减少深层选择器;必须覆盖组件内部样式时,限定范围并说明原因。禁止大范围覆盖 .arco-*、堆叠 !important,或通过固定高度、负边距掩盖布局问题。 仅在业务需要时提供深色模式;官方深色机制使用 body 的 arco-theme="dark" 属性,仍应检查自定义区域、图表、弹层和文字对比度。函数式 Modal、Message 等额外验证语言、主题和应用上下文,不假定包裹 ConfigProvider 后任何独立调用都会继承配置。 ### 建立克制、规整的中文业务界面 以下数值属于本项目缺少规范时的设计建议,不是 Arco 官方强制标准。已有品牌和设计规范优先,同一工程保持一致。 采用中性浅灰页面背景、清晰的内容表面、单一主色和必要的状态色。默认正文 14px、辅助说明 12px、区块标题 16px、页面标题 20px;间距优先使用 4、8、12、16、24px。字号、行高、圆角和边框形成稳定层级,不随页面任意新增尺度。 查询列表页按“标题与主要操作 → 查询条件 → 结果或业务内容 → 分页”组织;需要结果摘要时才增加摘要,详情与编辑页面按业务内容分组。对齐左边缘、控件基线、操作区和内容宽度,同类页面沿用同一骨架。用留白、分组和轻边框区分层级,不把每一小段内容都包成卡片。 主按钮突出当前最重要的业务动作,次要动作保持克制;相同行为的按钮顺序、名称和危险色一致。图标辅助识别,不代替必要文字,不混用多套视觉风格。 不添加大面积渐变、玻璃效果、夸张阴影、胶囊化控件、彩虹状态卡、装饰性徽章和占据首屏的欢迎区。没有业务数据支撑时不增加统计指标、增长率、荣誉认证和宣传口号。 文案使用真实业务名称,短而明确;提示说明用户需要做什么。界面不展示组件实现、内部架构、技术术语堆砌或“智能赋能”等无实际含义的宣传文字。不要为展示设计能力改变用户已熟悉的办理顺序。 ### 把列表、表单和详情作为完整业务流程处理 列表:筛选项按使用频率排序,展开与收起不丢值;查询、重置和变更每页条数后的页码规则明确。对象标识、关键状态及主要操作易于定位;文本通常左对齐,金额和数量右对齐并注明单位。长内容提供完整查看入口,状态同时用文字表达,不只靠颜色。 Table 的数据、列、唯一键、分页、排序、选择事件必须核对 Arco Vue 文档。row-key 使用稳定业务键字段,不用页内序号冒充记录标识;远程分页、排序和筛选与服务端参数对应,不对单页数据做排序却宣称全量排序。selected-keys 等受控选择仅维护一份真实状态,明确当前页和跨页批量选择范围。 详情返回列表时按业务需要保留筛选、页码和滚动位置。批量操作反馈成功、失败与可重试范围,能定位失败记录;关键字段、长公司名、大金额和时间信息不被固定列或操作列遮挡。 表单:字段按业务填写顺序分组,标签、必填标识、控件宽度及帮助文字一致。错误在字段附近展示并可定位,保存失败保留合理输入,重置前确认需要恢复的基准值。日期、时区、精度、ID 字符串及空值含义以接口契约为准,不用格式化操作改变业务值。 Arco Form 使用 model,FormItem 使用 field 对应数据路径。validate() 的成功结果是 undefined,失败结果是错误对象,不能仅靠 catch 判断校验失败;resetFields 与 clearValidate 分别涉及字段重置与校验状态清理,不能互相替代。按已安装版本确认行为后实现。 简单确认使用弹窗,较长编辑或需要保留列表上下文时选择合适的抽屉或独立页面。弹窗使用当前版本支持的 v-model:visible;异步确认正确处理 on-before-ok 的返回结果。before-close 是事件,不能当作异步关闭守卫。提交失败时不误关弹窗,重新打开时不残留上一条记录和校验状态。 详情页先呈现对象名称、编号、状态和适用操作,再按业务关系组织字段。审批记录和时间线来自真实数据,不补造操作者、进度或成功记录。 ### 保证状态、权限与请求一致 区分初次加载、刷新中、无数据、查询无结果、失败、权限不足和成功。空值、零值与未知状态不能混用。失败提供适当重试入口,恢复后回到正常界面,不把临时加载失败永久保留为“服务升级中”。 复用现有请求封装与错误处理,用户提示和排查日志各有明确位置,不重复弹出同一错误。快速切换筛选、路由或编辑对象时,使用适当的请求取消或结果序号校验,防止旧响应覆盖新状态;清理定时器、监听器和订阅。 提交按钮展示处理中状态并防止连续点击,但不把前端禁用当成服务端幂等保证。写请求超时不能直接认定失败并自动重复提交,应展示结果待确认,并提供结果查询或人工核对路径;用户点击确认本身不代表可以安全重试。 菜单、按钮、数据列表、详情、导出和统计遵循实际角色、组织与租户范围。前端隐藏按钮不能替代服务端授权。缺少后端能力时明确指出,不用前端模拟校验宣称已经解决权限或幂等问题。 不硬编码真实密钥,不把错误堆栈和敏感业务字段展示给用户。富文本、外部链接和文件操作沿用工程安全约束,避免未经处理的 v-html。 ### 兼顾性能、适配和可操作性 基于实际瓶颈优化:避免模板内重复大规模运算、无意义深度监听、重复请求以及可以局部更新却整页重建的行为。按现有能力使用路由懒加载和资源按需加载;大列表先核实分页与组件能力,确有需要再采用虚拟化,不凭空宣称性能提高多少。 同一页面信息密度一致,不用极小字号、压缩点击区或大面积空白解决布局问题。宽表可在自身区域横向滚动,页面主体不得意外横向溢出;窄屏合理收纳筛选和次要操作,保留关键对象、状态与主要动作。 按约定终端验收;未约定时桌面至少检查 1440px 和 1280px 宽度,窄屏兼容检查 768px 和 390px。检查长中文换行、固定区域遮挡和弹窗可见范围,不以固定宽高适配所有屏幕。 保证键盘能够进入主要操作,焦点可见,弹窗关闭后焦点合理返回。仅图标按钮有可理解的名称,重要信息不只依赖悬浮或颜色;检查浏览器放大后的文本与操作可达性。使用真实或明确标记的脱敏样例覆盖边界内容。 ## 交付与验收 ### 完成验证并交付 先改造一个有代表性的页面验证公共规则,再在明确范围内推广;已有明确规范或任务很小时直接按范围实施,不增加无必要的审批环节。 运行与变更匹配的 lint、类型检查、构建和已有测试。对校验、字典映射、请求竞态、权限状态、批量操作等实际风险补充必要测试,不为颜色、空格或简单配置编写只重复实现的测试。 实际打开改造页面,至少验证查询与重置、分页、详情返回、新建或编辑、校验失败、保存成功与失败、取消关闭,以及范围内涉及的权限和异常状态。检查本轮产生的控制台错误、请求失败、中文截断、布局溢出和按钮遮挡;后端不可用时区分静态检查与真实联调结果。 交付时简要说明:改了哪些文件及原因;采用的布局与主题约定;复用或删除了哪些重复能力;实际运行的命令及结果;实际验证的页面和状态;尚未验证或依赖外部条件的事项。必要时提供页面截图对比,不伪造测试通过、数据结果和性能结论。 默认直接修改已有工程并在回复中说明使用方式,不额外生成总结类 Markdown 文档;只有用户明确要求或项目流程已有明确要求时才增加相应文档。 ### 本条完成检查 - 交付实际改动文件、职责与状态归属、布局和主题约定,说明重复能力的复用或删除依据。 - 核对 Form 的 model/field 与 validate 返回值、Modal 的 visible/on-before-ok、Table 的稳定键和受控选择,验收成功、失败及切换记录。 - 运行适用的 lint、类型检查和构建,检查正文规定的桌面与窄屏尺寸、中文换行和新增控制台错误;未执行项单列。 按本条要求组织结果,使用简洁中文和一致的编号、术语、缩进及空行;已有项目格式优先。只说明实际完成的内容,将采用的假设、未完成项和缺少的条件写在相关位置,不额外生成无关文档。未执行、无法复现或缺少证据的检查如实标注,不宣称已通过或已有性能收益。 ## 参考资料与适用边界 本提示词是结合 Arco Design Vue 官方资料整理的工程执行规则。组件用法按官方资料核对;目录划分、视觉默认值与交付要求属于项目实践建议,不代表官方认证,也不表示已经在任意工程中运行验证。资料核验日期:2026-09-08;下面的 main 链接会更新,实际实施必须以工程安装版本及对应版本文档为准。 [Arco Design Vue 官方仓库与安装入口](https://github.com/arco-design/arco-design-vue) [ConfigProvider 中文配置与上下文](https://github.com/arco-design/arco-design-vue/blob/main/packages/web-vue/components/config-provider/README.zh-CN.md) [中文语言包使用示例](https://github.com/arco-design/arco-design-vue/blob/main/packages/web-vue/components/config-provider/__demo__/basic.md) [主题定制](https://github.com/arco-design/arco-design-vue/blob/main/packages/arco-vue-docs/docs/theme.zh-CN.md) [深色模式](https://github.com/arco-design/arco-design-vue/blob/main/packages/arco-vue-docs/docs/dark.zh-CN.md) [Table 数据、分页与选择](https://github.com/arco-design/arco-design-vue/blob/main/packages/web-vue/components/table/README.zh-CN.md) [Form 校验与字段方法](https://github.com/arco-design/arco-design-vue/blob/main/packages/web-vue/components/form/README.zh-CN.md) [Modal 异步确认与关闭](https://github.com/arco-design/arco-design-vue/blob/main/packages/web-vue/components/modal/README.zh-CN.md)
从真实页面的测量与复现出发,优化请求竞态、状态同步、列表渲染、包体积和表单反馈,并验证接口幂等边界、代码规范及关键业务交互。适用于保留现有技术栈的 Vue 存量工程。
## 任务目标 请完成选定 Vue 页面或模块的性能、状态一致性与交付质量优化,先测量问题,再落地代码并验证。指标未给出时先记录基线并提出与场景相符的目标,不虚构响应时间、提升比例或用户规模。 在现有授权范围内完成实际改动和验证;缺少外部条件时先完成可独立实现的部分,不能只停留在计划。 ## 输入信息(选填) 两项均可留空,也可直接用一句话说明目标并附上已有资料。无需自行整理版本、配置或完整需求表;能读取的内容由执行者补齐。 优化对象或现象:优先定位对话中提到的慢操作或状态错乱;未描述现象时,从当前页面的首屏、筛选、分页和编辑切换建立基线,先处理可复现的状态错误和重复请求。 工程或复现资料:使用已确认工程的路由、组件、请求封装、store、测试数据和现有性能记录;可运行时自行采集网络、渲染和构建产物证据。 ## 信息不完整时 先使用本次对话中已经说明的信息;用户留空、写“暂无/不清楚”或未替换输入标记,都按缺失处理,不当作真实路径、参数或业务值。已能从资料确定的内容不重复询问,不编造文件、日志、接口、业务值或执行结果。在用户已授权的范围内读取相关工程和材料,不为补齐输入擅自扩大操作范围。 ### 优先确认 - 核实 Vue 2/3、JS/TS、请求库、UI 库、路由缓存及现有 watcher 清理方式,不要求用户手填版本。 - 沿筛选、翻页和切换记录检查状态写入、请求取消、旧响应及 finally 的生效条件。 - 记录代表性操作的数据规模、模式、缓存、设备和网络条件,分开测量接口等待、重复请求、计算与组件更新。 - 检查模板循环、字典查找、资源导入、路由拆包和真实产物,确定优化影响范围。 ### 可采用的默认处理 - 未给性能指标时先采集可复查基线,以消除已证实浪费且业务不回归为目标,不承诺任意提速比例。 - 优先局部状态、纯 computed 与必要副作用清理;未证实瓶颈前不引入虚拟列表、全局缓存或 memo。 - 保留当前分页、选择及字典语义,写请求超时显示结果待确认,不把取消请求当作撤销业务。 ### 必须有依据的事项 - 优化涉及跨页选中、缓存失效或租户切换,而代码与接口无法确定需要保留的业务状态。 - 写操作结果未知且接口没有查单、幂等或补偿依据,不能自行重试并宣称提交成功。 只有缺口会改变业务结果、权限边界或关键实现,且无法从现有资料确认时,才集中提出最多 3 个关键问题;说明影响,并继续完成不依赖答案的部分。一般命名、排版和可逆实现细节按现有约定决定,不逐项等待确认。 ### 资料仍不足时的交付 - 无法运行页面时交付按代码证据排序的瓶颈候选、状态写入图和最小修正,另给同条件测量步骤。 - 没有代码时给出筛选竞态、重复提交、页面恢复的复现与验收用例,不填造耗时或包体数据。 ## 执行要求 关注用户操作结果和可复查证据,不为了使用优化技巧改动系统架构。 ### 读取工程并建立可比基线 确认目标目录、分支和 dirty 改动,保留原有内容,只改选定范围。核实 Vue 2/3、JS/TS、API 风格、构建框架、UI 库、store、路由、请求库和锁文件,保留选型,不默认升级或迁移。复现首屏、筛选、翻页、弹窗、切换记录等实际问题;记录数据规模、生产构建或开发模式、缓存状态、设备及网络。结合浏览器性能、网络、Vue DevTools 和构建分析,区分接口等待、重复请求、脚本计算、组件更新和资源加载;权限或数据错误优先于微小速度收益。 ### 定位结构与状态责任 页面编排流程,业务组件承接领域交互,通用组件负责稳定通用契约,composables/hooks 管理组合式逻辑和清理,API 层统一请求契约,store 管理必要共享状态,types 与 styles 各归其位;按问题整理现有模块,不建空目录。纯无副作用函数进入 util,领域规则集中在业务模块,真正共用的响应式能力才复用。不要把数据、权限、表单和所有展示塞进万能组件或 util,也不为性能把所有状态搬入全局。 ### 消除状态不同步 为查询条件、分页、选择项、表单和缓存分别确定唯一写入来源,派生值用 computed,props、事件载荷和 v-model 契约明确,不直接修改父级状态。检查路由返回、筛选重置、切换租户或记录、删除末页数据后的状态;分页和选择项的保留规则必须对应业务。编辑副本说明与源数据同步时机,避免双向 watch 相互回写。枚举和魔法值与服务端数据库码、权限及字典一致,已有字典继续复用,禁止复制另一套状态映射;失效缓存不得让旧权限或旧字典继续控制操作。未知或停用字典码保留原始值并作可识别提示,禁止映射为成功、首项或任意合法状态;编辑提交按真实接口契约处理,不为消除告警擅自改写原值。 ### 处理请求竞态和副作用 快速输入、连续翻页、切换弹窗记录会形成并发请求。按当前请求库取消可取消的旧请求,同时用序号或请求条件快照保护结果、错误和 finally,确保过期请求不能覆盖当前内容或解除新请求的 loading;不同业务请求分别维护状态。取消客户端请求不代表服务端业务已撤销,写操作超时不能直接自动重试。watch 只监听必要源,避免无边界 deep 和回写循环;清理失效请求、监听、定时器与订阅。Vue 3.5+ 的 onWatcherCleanup 必须同步注册,低版本使用其支持的清理机制和生命周期;离开、卸载及缓存页面停用时按实际行为处理。 ### 控制计算与渲染成本 v-for 采用稳定唯一的业务 key,排序和编辑列表不用索引、随机值或时间戳。将模板和循环中昂贵过滤、排序、格式化、字典查找移到有明确依赖的派生层;computed 保持纯计算,不夹带请求或状态修改。对重复查找按数据规模建立合适索引,注意索引随源数据更新。避免每项都发请求;优先真实可用的批量查询或服务端分页,没有接口时说明限制并控制并发,不伪造后端能力。检查 props 是否反复创建无意义新对象、组件是否无关更新;按证据减少渲染,不盲目 memo、深比较、shallow API 或缓存,防止失去必要更新。 ### 按场景优化列表与资源 根据实测 DOM 数量、交互延迟和数据规模选择分页或虚拟列表,核验行高、滚动定位、选择项、键盘操作与 UI 库能力,不用固定条数一刀切。测量实际生产包、关键路由资源和重复依赖,按既有构建能力优化导入、路由懒加载及重资源加载时机;确保首个操作不会因拆包失败失效。移除代码或依赖前核查自动导入、动态路由、按需组件与注册入口。缓存明确键、有效期、失效条件及身份边界,不用长期全局缓存掩盖接口问题。任何优化都要有前后相同场景的记录,不能以依赖宣传体积代替实际产物。 ### 完成可用的业务反馈 区分 loading、empty、error、成功及权限不足,失败不可显示成空数据,保留数据或清空数据按场景说明。正确区分 null、未提供、0、false 和空字符串。表单按输入、失焦与提交时机校验,错误就近展示并可纠正;服务端失败保留合理输入,弹窗关闭、重新打开不残留旧结果。提交时即时反馈并防重复点击,后端幂等键、唯一约束和事务仍由接口承担;没有后端能力时写明局限,不能把防抖当幂等。失败后给出真实可行的恢复路径,不吞错、不伪造成功。 ### 把优化纳入既有规范 保持政企中文界面的层级、对齐、间距、表格密度、主次操作和反馈一致,不添加非业务口号与技术说明。命名清楚,注释解释业务原因、接口限制和性能取舍,不逐行注释。使用兼容版本的 ESLint、eslint-plugin-vue,TS 工程配套 typescript-eslint,并保留 .vue 与脚本解析器分工;沿用 flat/legacy 模式和现有 ESLint 或 Prettier 格式方案。统一空格、缩进、换行、引号、分号、导入及文件区块顺序,对齐 .editorconfig;兼容配置只解决格式职责冲突,不降低质量门槛。零新增 lint 违规,不用 disable、扩大 ignore、any 或 ts-ignore 隐藏问题,不整仓格式化制造无关差异。 ## 交付与验收 ### 验证结果并完成交付 实际执行相关 lint、适用的 typecheck、生产 build 和关键交互验收;JS 工程无类型检查时说明不适用,工具或环境缺失则标记未执行。至少覆盖正常与空数据、未知与停用字典码、接口失败与恢复、快速筛选翻页、旧响应晚到、连续提交、切换记录、返回页面和权限变化;验证表单失焦、弹窗焦点、中文换行及新产生的控制台错误。只在隔离且获准的测试环境模拟网络故障,不影响真实业务。性能比较保持设备、数据、模式及缓存条件一致,多次记录波动,分别列包体积、请求量、渲染或交互指标;改善不能以业务回归为代价,未改善也如实报告。 输出:①问题、复现及基线;②已实现改动与关键路径,说明结构、状态和请求规则;③实际生效的检查与格式配置;④优化前后指标和测量条件;⑤验收项目、命令或操作、结果及未执行原因;⑥剩余限制和最小后续工作。保留历史失败与新增问题的区分,未跑不宣称通过,没有测量不宣称提速。完成已授权实现,不只提交建议,不生成无关 Markdown 文档。 ### 本条完成检查 - 记录问题、基线、实际修改和相同条件下的优化前后指标,未改善或未测量如实列明。 - 验收旧响应晚到、finally 竞态、快速分页、记录切换、权限变化及未知字典码,不以性能收益抵消业务错误。 - 执行相关 lint、适用类型检查、生产构建与关键交互,列出真实命令、结果和剩余限制。 按本条要求组织结果,使用简洁中文和一致的编号、术语、缩进及空行;已有项目格式优先。只说明实际完成的内容,将采用的假设、未完成项和缺少的条件写在相关位置,不额外生成无关文档。未执行、无法复现或缺少证据的检查如实标注,不宣称已通过或已有性能收益。 ## 参考资料与适用边界 官方依据:Vue 性能:https://vuejs.org/guide/best-practices/performance.html、Vue 监听清理:https://vuejs.org/guide/essentials/watchers.html、阿里前端规约:https://github.com/alibaba/f2e-spec、Vue 插件配置:https://eslint.vuejs.org/user-guide/、Prettier 与 Linter:https://prettier.io/docs/integrating-with-linters。 收录核验(2026-09-08):已核对公开资料和本次项目要求的覆盖范围;尚未使用真实项目执行本模板或进行模型效果评测。具体改动、性能和回归结果须在目标工程中验证。
适用于已有 Vue 2/3、JS/TS 工程:梳理页面与组件职责、状态所有权、API 和字典边界,落实兼容版本的 ESLint、格式规范及实际交互验收。保留既有选型和未提交改动,在选定范围内完成代码重构。
## 任务目标 请在真实 Vue 工程中完成选定范围的结构、组件和编码规范重构,交付实际代码及验证结果。先读取工程;能从代码确认的信息不重复询问。资料缺失时标明事实与假设,只对阻断实施的关键项提问,其余授权工作继续完成。 在现有授权范围内完成实际改动和验证;缺少外部条件时先完成可独立实现的部分,不能只停留在计划。 ## 输入信息(选填) 两项均可留空,也可直接用一句话说明目标并附上已有资料。无需自行整理版本、配置或完整需求表;能读取的内容由执行者补齐。 重构对象:从当前对话指定的页面、模块或改动文件识别范围;维护问题未说明时,优先检查该范围内职责混杂、重复业务逻辑和多处可写状态,实施可证明保持行为的局部重构。 工程或代码资料:读取当前已确认工作区中的组件、调用方、API、store、字典与规范配置,并从既有测试和页面操作提取行为基线。 ## 信息不完整时 先使用本次对话中已经说明的信息;用户留空、写“暂无/不清楚”或未替换输入标记,都按缺失处理,不当作真实路径、参数或业务值。已能从资料确定的内容不重复询问,不编造文件、日志、接口、业务值或执行结果。在用户已授权的范围内读取相关工程和材料,不为补齐输入擅自扩大操作范围。 ### 优先确认 - 检查分支与未提交内容,以及 Vue、脚本语言、API 风格、构建和组件库的真实版本。 - 从页面入口追踪 props、emits、插槽、v-model、请求与字典,确认状态所有者和外部契约。 - 搜索真实复用场景、自动导入、动态路由和插件注册,确认抽取及删除不会破坏运行时引用。 - 读取 ESLint 与 Vue/TypeScript 解析器、flat/legacy 配置、格式化方案及已有验收命令。 ### 可采用的默认处理 - 保留 Vue 2/3、JS/TS、组件库和状态管理选型,不通过框架迁移解决局部结构问题。 - 按已有业务职责整理目录;纯工具、组合式逻辑和领域规则分别归位,不机械创建空目录或万能组件。 - 保持界面、接口、事件和字典值稳定,保留无关改动,规范治理只覆盖本次范围且不得靠忽略规则消除新增错误。 ### 必须有依据的事项 - 调用方对同一组件的事件、空值或编辑副本语义存在冲突,且抽取后必须改变其中一方的业务行为。 - 需要修改对外字段、路由或业务状态码才能继续,而实际兼容约束和使用方无法从工程确认。 只有缺口会改变业务结果、权限边界或关键实现,且无法从现有资料确认时,才集中提出最多 3 个关键问题;说明影响,并继续完成不依赖答案的部分。一般命名、排版和可逆实现细节按现有约定决定,不逐项等待确认。 ### 资料仍不足时的交付 - 只有片段时交付该片段的职责拆分与契约表、完整局部修改示例,并列出需回查的调用方。 - 没有工程时给出重构检查顺序、组件边界判据和关键行为回归清单,不以虚构文件说明已落地。 ## 执行要求 以当前工程事实决定实现,降低理解和修改成本,不按文件行数或目录数量评价重构效果。 ### 确认范围和基线 检查分支、未提交及未跟踪改动,记录目标文件现状,保留已有 dirty 内容,不覆盖其他人的工作。确认实际 Vue 2/3、JS/TS、Options/Composition API、构建框架、UI 库、路由、store、请求库和锁文件版本;沿用既有选型,不强迁移 Vue、TypeScript、Vite、Pinia 或组件库,不顺手升级依赖。跟踪页面入口、权限、请求、数据转换和显示结果,先列出待修问题、最小修改范围及可验收行为;未经授权不扩展为整仓格式化。 ### 按职责整理代码 页面负责路由参数与页面流程编排;业务组件承接明确领域场景;通用组件只保留稳定的跨场景交互契约;composables/hooks 承接可复用的响应式逻辑和生命周期;API 层负责请求契约;store 只保存确需共享的状态;types 记录已有类型契约;styles 归属主题、布局或组件。利用现有目录表达这些职责,不机械新建空目录,不为了拆分制造层层透传。纯格式转换和无副作用计算抽到 util;权限判断、字典转换等领域能力放在明确业务模块集中管理,不堆进万能 util。 ### 确定组件边界 沿业务职责、独立变化和真实复用拆分,避免既请求数据又拼装所有页面的超大万能组件;相似外观但行为不同不强行统一。复用方案必须列出至少两个真实使用场景或独立职责理由。明确 props 的类型、默认值、必填和空值含义,事件说明触发时机与载荷,插槽和 v-model 按当前版本定义;不直接修改 props 或隐式改写父级对象。组件内部实现保持封装,不用过量开关和跨层 ref 调用拼出第二套页面框架。 ### 收敛状态和业务规则 每个业务状态明确唯一所有者,避免 props、局部副本、store 和 URL 各维护一套可写真相。派生值用 computed,表单编辑副本说明初始化、回填、取消与提交边界,切换记录不残留上条数据。业务状态码、枚举、权限标识与服务端和数据库字典一致,不能自行改名改值;已有字典接口或生成类型继续复用,不复制第二套硬编码。只有稳定的前端配置才抽命名常量;未知字典码给出可识别回退,不默认为正常状态。区分 0、false、空字符串、null 和未提供,不能用通用假值判断抹掉有效业务值。 ### 保留异步与交互正确性 分别处理 loading、empty、error、成功和权限不足,不把请求失败展示成暂无数据;刷新已有数据是否保留由场景决定。表单校验按输入、失焦和提交时机给出字段附近反馈,首次进入不满屏报错,失败后保留合理输入。前端提交锁和按钮反馈负责防连点,服务端幂等键、唯一约束及事务由真实接口负责,不能承诺禁用按钮即可防重复写入。查询变化时按请求库能力取消旧请求,并用请求序号或条件快照保护旧响应及 finally,避免覆盖新结果或提前清掉 loading。watch 仅处理必要副作用,清理定时器、事件、订阅与失效请求;按实际 Vue 生命周期实现,不套用当前版本不存在的清理 API。 ### 重构同时守住性能 v-for 使用稳定且唯一的业务 key,可排序或编辑列表不用索引、随机数和时间戳作 key。移出模板和循环里的昂贵计算、重复字典查找及逐项请求;纯派生用 computed,保持无副作用且依赖完整。批量接口须确实存在,不得编造;没有时按业务限制控制请求量。复用组件不能引入多余渲染和请求,分页、虚拟列表、memo 或全局缓存都要基于真实瓶颈再决定。若修改加载方式或依赖,记录构建包体积与关键页面渲染变化,不把“组件更多”当作性能提升。 ### 把规范落实到工具 使用现有兼容版本的 ESLint 与 eslint-plugin-vue,TS 工程配套 typescript-eslint;检查 .vue 外层解析器和脚本解析器分工,确保模板、脚本和目标文件确实进入检查。保留 flat 或 legacy 配置,先核对 Node、ESLint、插件及 TS 版本,再补缺失配置,不照搬最新版。统一空格、缩进、换行、引号、分号、导入分组和单文件组件区块顺序,以项目已有 ESLint 或 Prettier 方案为准,并对齐 .editorconfig。若并用,明确格式和质量职责,按兼容机制消除重复格式规则冲突,不能借机降低质量门槛。 ### 清理与可读性 改动范围做到零新增 lint 违规;不要靠新增 disable、扩大 ignore、any、ts-ignore 或删除检查绕过问题。历史问题与新增问题分开记录,无法修复的阻断如实报告。命名表达业务,函数职责单一;注释解释业务原因、接口边界、限制和必要取舍,不机械逐行翻译代码。删除冗余分支、废弃样式与依赖前核查静态引用、自动导入、动态路由、按需组件、插件注册及运行时使用,不能只凭一次文本搜索判定无用。 ## 交付与验收 ### 实际验收与交付 维持政企中文页面的清楚层级、对齐、间距、操作顺序和信息密度,复用现有 UI 规范;不新增装饰性口号或非业务说明。实际运行范围相关 lint、项目适用的 typecheck、生产 build 和关键交互验证;纯 JS 且无类型检查时标注不适用,已有检查缺失则说明覆盖缺口。重点验证查询重置、分页排序、编辑回填、取消保存、错误恢复、快速切换和权限状态,同时检查中文换行、弹窗焦点、按钮可用状态及新产生的控制台错误。原有检查失败不等于本次失败,但必须给出前后证据,不能宣称整体通过。 最后输出:①实际改动及解决的问题,列关键路径;②职责、组件契约、状态所有权与枚举来源的简表;③采用的格式和检查规则、版本兼容处理;④验证项、真实命令或操作、结果及未执行原因;⑤剩余风险和最小后续事项。只写完成事实,未跑不报通过,无证据不报提速;不生成无关 Markdown 文档,不以重构方案替代已授权的代码实现。 ### 本条完成检查 - 交付实际代码、关键路径以及职责、组件契约、状态所有权和字典来源简表。 - 说明抽取的真实复用依据与删除的引用检查结果,核对重构未引入重复请求、props 修改或状态双写。 - 运行范围相关检查和生产构建,验证查询、编辑、取消、错误恢复与快速切换,区分历史失败和本次新增问题。 按本条要求组织结果,使用简洁中文和一致的编号、术语、缩进及空行;已有项目格式优先。只说明实际完成的内容,将采用的假设、未完成项和缺少的条件写在相关位置,不额外生成无关文档。未执行、无法复现或缺少证据的检查如实标注,不宣称已通过或已有性能收益。 ## 参考资料与适用边界 官方依据:阿里前端规约:https://github.com/alibaba/f2e-spec、Vue 逻辑复用:https://vuejs.org/guide/reusability/composables.html、Vue 插件配置:https://eslint.vuejs.org/user-guide/、ESLint 配置:https://eslint.org/docs/latest/use/configure/configuration-files、Prettier 与 Linter:https://prettier.io/docs/integrating-with-linters。 收录核验(2026-09-08):已核对公开资料和本次项目要求的覆盖范围;尚未使用真实项目执行本模板或进行模型效果评测。具体改动、性能和回归结果须在目标工程中验证。
检查 Vue 源码、构建产物与浏览器可访问文件中的敏感信息,追踪泄露路径,区分可公开配置与需要保护的凭据。
## 任务目标 任务:Vue 浏览器交付物敏感信息检查。基于所提供工程和业务证据完成检查,先读取可访问的工程与证据,可以推进的部分继续完成;仅对查证后仍影响结论的关键缺口提问;不要编造文件、日志、测量结果或已完成的操作。 以核查和评审为主,给出有证据的判断及可复核的修改建议;本次用户另有明确实现要求时,按其授权范围执行。 ## 输入信息(选填) 两项均可留空,也可直接用一句话说明目标并附上已有资料。无需自行整理版本、配置或完整需求表;能读取的内容由执行者补齐。 交付物检查范围:从当前 Vue 工程的生产构建入口和实际输出目录开始,检查源码配置到浏览器文件的传播;未指定线上地址时只做本地与已知授权路径核验。 工程或发布资料:读取构建配置、环境变量定义、现有 dist 等产物、静态发布规则及用户已经提供的可访问资源路径。 ## 信息不完整时 先使用本次对话中已经说明的信息;用户留空、写“暂无/不清楚”或未替换输入标记,都按缺失处理,不当作真实路径、参数或业务值。已能从资料确定的内容不重复询问,不编造文件、日志、接口、业务值或执行结果。在用户已授权的范围内读取相关工程和材料,不为补齐输入擅自扩大操作范围。 ### 优先确认 - 识别构建版本、环境变量替换前缀、HTML 注释、内联配置与 source map 输出方式。 - 追踪候选信息进入 JS、HTML、调试文件和旧制品的链路,并区分客户端标识与服务端秘密。 - 检查已知静态目录、备份文件和缓存策略;仅在授权范围内验证具体可获取路径。 ### 可采用的默认处理 - 默认只读检查并输出脱敏证据,不展示真实凭据或使用凭据尝试登录。 - 没有公开访问证据只报告潜在暴露路径;公开接口地址和客户端 appid 不因名称相似就判定为密钥。 - 没有明确修复要求时只给最小改动及轮换处置建议,不擅自撤销凭据、改发布规则或清理线上缓存。 ### 必须有依据的事项 - 候选字段的实际保密属性或允许公开用途无法由配置和使用方确认,不能直接定性为已泄露秘密。 - 所需外部访问超出已有授权范围时,不继续枚举;只对该部分保留公开性待核验结论。 只有缺口会改变业务结果、权限边界或关键实现,且无法从现有资料确认时,才集中提出最多 3 个关键问题;说明影响,并继续完成不依赖答案的部分。一般命名、排版和可逆实现细节按现有约定决定,不逐项等待确认。 ### 资料仍不足时的交付 - 没有产物时交付源码到构建替换的传播路径和应检查的产物位置,不声称浏览器已可获取。 - 没有工程时给出 HTML、JS、source map、旧版文件的定向核验清单及脱敏问题表格式。 ## 执行要求 检查范围包括 Vue 源码、静态 HTML、JavaScript、source map 和部署配置。HTML 注释中的信息限制按文末规约核对;构建产物、调试文件与公开配置属于扩展检查,需要结合实际构建和访问证据判断。 检查 HTML 注释中是否包含凭据、个人信息、内部地址等敏感内容,并追踪它们是否进入可公开获取的文件。按项目实际版本和发布方式判断暴露范围,不机械沿用旧示例。 1. 确认构建版本、实际输出目录和公开发布的文件范围,把开发源码、服务器私有文件、浏览器可获取文件分开;没有访问证据时只报告潜在暴露路径,不宣称已发生泄露。 2. 在HTML注释、内联配置及前端源码中查找可能敏感的类别,记录文件位置和信息类型,交付报告只给脱敏摘要;公开接口地址或可公开的客户端标识不能仅因名称像密钥就判为秘密。 3. 追踪疑似字段如何从环境变量、配置文件或构建替换进入客户端产物,核对实际构建结果;不要认为环境变量保存在服务器上,就必然不会被打进前端代码。 4. 检查source map、旧版文件、备份后缀和静态目录规则能否使原本未计划交付的内容被获取,仅核验授权范围内已知路径,不进行无边界的互联网枚举。 5. 提出移除敏感输入、转为服务端调用或修正发布范围的最小方案;若证据表明确有凭据暴露,将撤销和轮换列为专门处置事项,不能只删除注释后宣称风险消失。 6. 重新构建并核对新产物、静态服务与缓存中的可获取内容,验证受影响业务仍能正常调用;以同一个匿名样本标记验证链路,不用真实密码验证是否还会出现在输出中。 ## 交付与验收 输出:按候选信息、可信程度、来源到公开面的传播路径、最小修正和验证证据输出。问题表仅保留字段名、脱敏标记、文件位置及影响;明确哪些内容已确认公开可取、哪些尚未实际访问,以及缓存和旧制品的复核范围。 ### 本条完成检查 - 每个候选给出类型、脱敏标记、文件位置、传播链和已证实或待确认的公开范围。 - 对确认暴露的秘密区分代码移除、凭据轮换和缓存旧制品复核,不能仅删注释即宣布消除风险。 - 若实施修正,使用匿名样本复核新产物及业务调用,并如实记录尚未检查的发布面。 按本条要求组织结果,使用简洁中文和一致的编号、术语、缩进及空行;已有项目格式优先。只说明实际完成的内容,将采用的假设、未完成项和缺少的条件写在相关位置,不额外生成无关文档。未执行、无法复现或缺少证据的检查如实标注,不宣称已通过或已有性能收益。 ## 参考资料与适用边界 来源核验日期:2026-09-08。 - 阿里巴巴《f2e-spec:HTML 编码规约的注释信息限制》:https://github.com/alibaba/f2e-spec/blob/beb1ac899ea6dab206331263bbcdcad8f8fe336e/docs/coding/html.md 验证说明:已核对上述公开来源及具体规则或能力;本模板尚未通过模型对比实验或线上业务实测,不能以来源品牌、仓库热度或扫描分数代替验收。 来源许可说明:MPL-2.0(仓库许可)。本条为中文原创整理,来源内容与本模板补充要求已在正文区分。
定位路由切换后的样式串用、组件覆盖失效和弹层遮挡,核对选择器、样式覆盖与层叠关系,完成最小修改及相邻页面回归。
## 任务目标 任务:Vue 跨组件样式污染与弹层遮挡定位。基于所提供工程和业务证据完成检查,先读取可访问的工程与证据,可以推进的部分继续完成;仅对查证后仍影响结论的关键缺口提问;不要编造文件、日志、测量结果或已完成的操作。 以核查和评审为主,给出有证据的判断及可复核的修改建议;本次用户另有明确实现要求时,按其授权范围执行。 ## 输入信息(选填) 两项均可留空,也可直接用一句话说明目标并附上已有资料。无需自行整理版本、配置或完整需求表;能读取的内容由执行者补齐。 样式异常:优先复现对话或截图中的污染、遮挡现象;现象未描述时检查当前页面路由往返后的样式变化,以及弹窗、下拉和提示层的裁切与叠放。 页面或样式资料:从当前工程查页面组件、全局样式、组件库配置和实际浏览器页面;有运行条件时自行读取计算样式与挂载结构。 ## 信息不完整时 先使用本次对话中已经说明的信息;用户留空、写“暂无/不清楚”或未替换输入标记,都按缺失处理,不当作真实路径、参数或业务值。已能从资料确定的内容不重复询问,不编造文件、日志、接口、业务值或执行结果。在用户已授权的范围内读取相关工程和材料,不为补齐输入擅自扩大操作范围。 ### 优先确认 - 确定最短复现路径,比较直接进入、路由切换、返回后的异常元素。 - 从计算样式反查胜出规则、加载顺序、继承、scoped 转换及深度选择器。 - 检查弹层挂载点、overflow 裁切和层叠上下文,区分层级问题与父级裁切。 ### 可采用的默认处理 - 默认定位根因并给最小修改片段,不直接批量改 CSS;明确要求修复时才落地对应局部变更。 - 保留既有缩进、颜色语法和适配策略,优先收紧作用域或使用公开主题能力,不先堆叠 !important 和 z-index。 - 没有浏览器计算样式时把静态选择器冲突列为候选原因,不凭截图断定命中规则。 ### 必须有依据的事项 - 多个样式行为都可能符合现有实现,但业务要求的弹层优先级或交互可达区域彼此冲突,不能自行选定新的交互规则。 只有缺口会改变业务结果、权限边界或关键实现,且无法从现有资料确认时,才集中提出最多 3 个关键问题;说明影响,并继续完成不依赖答案的部分。一般命名、排版和可逆实现细节按现有约定决定,不逐项等待确认。 ### 资料仍不足时的交付 - 仅有源码时交付可疑选择器、层叠上下文和裁切点清单,附逐项浏览器取证步骤。 - 仅有截图时描述可见缺陷、可能的布局约束和同元素回归条件,不伪造样式来源。 ## 执行要求 检查 Vue 页面及组件样式,保留项目既有的缩进、现代颜色语法和浏览器适配策略。文末 FEX 资料为未定稿草案,核验提交来自 2018 年;使用其中建议时须核对当前 Vue、组件库和浏览器的实际行为。 重点检查选择器复杂度、缩写属性覆盖、!important 和视觉层级管理。以当前项目的样式生效结果确定修改方式,不机械沿用旧示例。 1. 先复现一条最短路径,记录初次进入、切换路由、再次返回的差异,标出发生异常的元素和业务影响;截图只能说明外观,不能据此猜定是哪条选择器生效。 2. 从浏览器计算样式反查命中的规则、来源文件、加载顺序、继承关系及被覆盖值,区分组件库默认样式、全局样式、scoped转换和行内样式,保留可定位的证据。 3. 检查过宽选择器、相同类名、深度选择器及第三方内部类覆盖,找出影响范围超出业务组件的声明;缩写属性要核对是否顺带重置了原本只想保留的方向或字体设置。 4. 对弹窗、下拉和提示层单独分析实际挂载位置与层叠上下文,区分被父容器裁切和层级较低;不要在未确认原因前反复增大z-index或叠加!important。 5. 提出一处根因对应一项最小修改,例如收紧作用范围、取消重复覆盖、使用组件公开主题能力或调整挂载位置;涉及组件库内部结构时注明升级维护成本。 6. 复核直接访问和路由来回切换,覆盖多个同类组件、弹层叠加、长中文、滚动及目标窄屏;记录修改前后同一元素的生效规则,验证相邻页面没有被连带改变。 ## 交付与验收 输出:给出复现路径、样式来源表、根因与证据、最小修改片段及受影响页面回归表。样式来源表包含元素、属性、最终值、胜出规则、来源位置与覆盖原因;不得将视觉截图通过等同于业务交互通过。 ### 本条完成检查 - 输出元素、属性、最终值、胜出规则、来源和覆盖原因,根因与建议一一对应。 - 复核同元素的前后规则、直接访问及路由往返,覆盖相邻页面和多弹层叠加。 - 分别记录视觉与点击、焦点、滚动验收,不能以截图正常替代交互通过。 按本条要求组织结果,使用简洁中文和一致的编号、术语、缩进及空行;已有项目格式优先。只说明实际完成的内容,将采用的假设、未完成项和缺少的条件写在相关位置,不额外生成无关文档。未执行、无法复现或缺少证据的检查如实标注,不宣称已通过或已有性能收益。 ## 参考资料与适用边界 来源核验日期:2026-09-08。 - 百度 FEX《CSS 编码规范(公开草案)》:https://github.com/fex-team/styleguide/blob/b1bc701d1c92220d0eb90e88ed4ccdc3d5c979dc/css.md 验证说明:已核对上述公开来源及具体规则或能力;本模板尚未通过模型对比实验或线上业务实测,不能以来源品牌、仓库热度或扫描分数代替验收。 来源许可说明:CC-BY-4.0(仓库 LICENSE.txt)。本条为中文原创整理,来源内容与本模板补充要求已在正文区分。
使用 TDesign ConfigProvider 统一表单、分页、日历、弹窗和空状态文案,完成符合国内政企业务习惯的界面验收。
## 任务目标 请检查当前 Vue 系统的中文界面和组件默认文案是否一致。 以核查和评审为主,给出有证据的判断及可复核的修改建议;本次用户另有明确实现要求时,按其授权范围执行。 ## 输入信息(选填) 两项均可留空,也可直接用一句话说明目标并附上已有资料。无需自行整理版本、配置或完整需求表;能读取的内容由执行者补齐。 中文界面检查范围:从当前后台页面与共用配置入口开始,检查日期、分页、校验、弹窗和空状态的实际文案;未给页面清单时选择现有列表、编辑和详情各一条真实路径。 工程或界面资料:读取现有 TDesign 依赖、ConfigProvider、局部组件属性、业务词汇及日期金额转换,并使用可访问页面核对显示。 ## 信息不完整时 先使用本次对话中已经说明的信息;用户留空、写“暂无/不清楚”或未替换输入标记,都按缺失处理,不当作真实路径、参数或业务值。已能从资料确定的内容不重复询问,不编造文件、日志、接口、业务值或执行结果。在用户已授权的范围内读取相关工程和材料,不为补齐输入擅自扩大操作范围。 ### 优先确认 - 查清已安装版本的 globalConfig、实际语言配置及局部覆盖,不猜语言包路径。 - 统计同一业务对象在列表、详情、编辑和反馈中的称呼,找出组件默认英文与中文混用。 - 追踪日期时区、金额单位和范围包含关系,分开检查显示格式与接口传输值。 ### 可采用的默认处理 - 默认只读检查并给配置及文案调整建议;明确统一文案时只改约定范围,不改变业务值。 - 通用控件文案归全局配置,业务动作留在对应页面;优先沿用已出现的准确业务名称。 - 无设计约定时保持政企中文布局的对齐、层级和主次操作,不添加营销词或虚构统计。 ### 必须有依据的事项 - 金额单位、时区、日期范围或业务状态名称存在多种合理解释且会影响用户判断,不能只为统一外观选一种。 只有缺口会改变业务结果、权限边界或关键实现,且无法从现有资料确认时,才集中提出最多 3 个关键问题;说明影响,并继续完成不依赖答案的部分。一般命名、排版和可逆实现细节按现有约定决定,不逐项等待确认。 ### 资料仍不足时的交付 - 仅有源码时交付全局与局部覆盖表、候选词汇差异和具体交互核对步骤。 - 只有截图时提供可见文案与布局修正,日期弹层、校验和分页语言仍标待运行确认。 ## 执行要求 在使用 TDesign 的 Vue 后台中,按当前版本的 ConfigProvider 能力检查全局文案与局部覆盖。中文业务命名和政企页面表达遵循本项目约定,不由组件默认配置代替业务判断。 1. 先统计表单、分页、日期选择、对话框、选择器和空状态使用位置,识别全局配置与页面局部覆盖。查明运行时真实显示的语言,不能只看系统菜单中文就判断基础控件已全部中文化。 2. 对照当前版本的 globalConfig 接口统一常用组件文案。把通用词放到统一配置,把“提交审批”“停用设备”等业务动作留在对应场景;不猜语言包路径或配置字段,不修改组件库的自动生成接口文件。 3. 核对月份、星期、日期占位、确认取消、表单必填和分页数量表达。逐项区分展示格式与接口传输格式,确认时区、日期范围两端是否包含、金额单位及小数位,避免为了统一外观改变实际业务含义。 4. 统一相同业务对象的称呼和状态词,检查列表、详情、编辑与结果提示是否一致。占位提示用于说明输入方法,不能代替字段标签;错误文字需要告诉用户哪一项有问题和如何修正。 5. 检查页面层级、筛选区、表格区和主要操作的位置。保持标签对齐、主次按钮清楚、中文换行自然和信息密度稳定,删除不帮助完成业务的宣传口号、虚构成绩及冗余装饰,保留必要状态和业务说明。 6. 实际打开不同业务页面,操作日期选择、无结果查询、必填校验、分页和弹窗。检查全局修改是否误伤特殊场景,重点验证较长机构名称、低分辨率窗口和加载失败状态,记录截图或可复现路径。 ## 交付与验收 输出:统一词汇表、全局配置及局部覆盖表、需调整的页面清单、验收结果。每项修改说明它改善的具体业务理解或操作;没有页面运行条件时给出待验证清单,不能把静态代码检索结果当作完整视觉验收。 ### 本条完成检查 - 形成统一词汇及全局、局部配置表,说明每项调整解决的业务理解问题。 - 操作日期、分页、必填校验、空结果和弹窗,确认配置生效且特殊场景未被覆盖。 - 检查长机构名、低分辨率和加载失败,静态检索与真实视觉验收分别报告。 按本条要求组织结果,使用简洁中文和一致的编号、术语、缩进及空行;已有项目格式优先。只说明实际完成的内容,将采用的假设、未完成项和缺少的条件写在相关位置,不额外生成无关文档。未执行、无法复现或缺少证据的检查如实标注,不宣称已通过或已有性能收益。 ## 参考资料与适用边界 官方来源(2026-09-08 核验): - [腾讯 TDesign《TDesign Vue Next ConfigProvider 类型与接口说明》](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/config-provider/type.ts)
处理 TDesign Dialog 表单弹窗、删除确认等场景中的重复提交、关闭来源、草稿保留和失败恢复。
## 任务目标 请核查当前 Vue 业务弹窗的保存、关闭与异常恢复,使用户能明确完成操作并在失败后继续处理。 以核查和评审为主,给出有证据的判断及可复核的修改建议;本次用户另有明确实现要求时,按其授权范围执行。 ## 输入信息(选填) 两项均可留空,也可直接用一句话说明目标并附上已有资料。无需自行整理版本、配置或完整需求表;能读取的内容由执行者补齐。 弹窗业务目标:沿当前页面使用的目标弹窗追踪打开、输入、确认和关闭;未描述缺陷时重点检查提交未完成即关闭、失败无法恢复及切换记录残留。 弹窗或接口资料:读取弹窗与父页面、表单、保存接口、状态管理和已安装 TDesign Dialog 类型,从现有逻辑提取草稿及成功后刷新规则。 ## 信息不完整时 先使用本次对话中已经说明的信息;用户留空、写“暂无/不清楚”或未替换输入标记,都按缺失处理,不当作真实路径、参数或业务值。已能从资料确定的内容不重复询问,不编造文件、日志、接口、业务值或执行结果。在用户已授权的范围内读取相关工程和材料,不为补齐输入擅自扩大操作范围。 ### 优先确认 - 确认弹窗唯一任务、对象、visible 所有者和真实请求周期。 - 核对取消、关闭按钮、遮罩和 Escape 的实现及当前版本是否支持异步拦截。 - 检查回车与表单提交重复触发、编辑回填、销毁重建、旧响应和成功后的页面刷新。 ### 可采用的默认处理 - 默认核查并给状态表和必要修正;明确修复要求时在现有组件能力内实现,不额外建立弹窗框架。 - 保存失败保留合理输入并恢复操作,服务端结果未明确前不展示成功或自动关闭。 - 沿用已有草稿和关闭约定,前端提交锁仅防重复触发,不当作后端幂等保证。 ### 必须有依据的事项 - 未保存草稿是否允许丢弃、提交中是否允许关闭缺少业务约定,且实现必须改变当前数据保留行为。 - 接口可能已受理但无返回,缺少幂等或结果查询依据时不能自行再次写入。 只有缺口会改变业务结果、权限边界或关键实现,且无法从现有资料确认时,才集中提出最多 3 个关键问题;说明影响,并继续完成不依赖答案的部分。一般命名、排版和可逆实现细节按现有约定决定,不逐项等待确认。 ### 资料仍不足时的交付 - 缺源码时交付显示和请求状态、各关闭来源处理及失败恢复方案,组件 API 明确待按版本核对。 - 后端不可用时用隔离的成功、校验失败、延迟和未知结果验证前端处理,真实联调单列。 ## 执行要求 按当前版本的 TDesign Dialog 能力处理显示、加载和关闭事件。业务操作的幂等、授权以及是否允许取消,需要依照项目事实实现。 1. 列出弹窗承担的唯一主要任务、操作对象和完成条件。区分确认删除、编辑保存、结果提示等场景,按钮直接写业务动作;需要说明影响范围时描述真实后果,不使用笼统的“温馨提示”掩盖关键内容。 2. 设计未操作、输入中、提交中、成功、失败等状态,确定谁控制 visible。把确认按钮加载与真实请求周期绑定,避免请求尚未结束弹窗就关闭,或请求失败后按钮一直处于不可用状态。 3. 分别处理取消按钮、关闭按钮、遮罩点击和 Escape。存在未保存修改时按业务约定保留、确认放弃或阻止关闭;不要把返回 void 的动画前回调误当成支持异步拦截的关闭守卫,应检查该版本真实接口能力。 4. 核对回车确认与内部表单提交是否可能同时触发请求。对连续点击、键盘触发和慢请求期间再次操作进行限制;前端限制只减少重复触发,涉及不可重复业务操作时同时核查服务端约定。 5. 明确关闭时是否销毁子内容以及重新打开时如何初始化。编辑另一条记录时清理旧对象、错误提示与异步回调,成功后根据接口实际结果刷新列表或详情;不得把本地假定值直接当成服务器保存结果。 6. 验收焦点进入与返回、键盘操作、长内容滚动、遮罩遮挡和中文按钮长度。模拟业务校验失败、网络中断、延迟响应、重复触发及用户切换记录,检查能否继续编辑或安全返回原页面。 ## 交付与验收 输出:弹窗状态表、每种关闭来源的处理、必要代码修改和验收记录。对接口已受理但客户端未收到结果的情况单独说明确认结果的办法,避免直接再次提交。缺少版本或源码时先给处理方案和待核实 API,不声称组件天然保证全部业务安全。 ### 本条完成检查 - 给出状态表、关闭来源与草稿处理,确认异步守卫采用实际 API 而非动画回调。 - 验证点击与回车重复、失败保留输入、切换记录、旧响应和成功后真实数据刷新。 - 检查焦点进入返回、键盘、长内容滚动及遮挡,分别记录已执行与待联调行为。 按本条要求组织结果,使用简洁中文和一致的编号、术语、缩进及空行;已有项目格式优先。只说明实际完成的内容,将采用的假设、未完成项和缺少的条件写在相关位置,不额外生成无关文档。未执行、无法复现或缺少证据的检查如实标注,不宣称已通过或已有性能收益。 ## 参考资料与适用边界 官方来源(2026-09-08 核验): - [腾讯 TDesign《TDesign Vue Next Dialog 类型与接口说明》](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/dialog/type.ts)
围绕服务端分页和批量业务操作,核查 TDesign Table 的行标识、筛选排序、跨页选中、状态反馈与请求结果一致性。
## 任务目标 请根据本次要求,开发或检查 Vue 业务列表的查询、分页与批量操作。 以核查和评审为主,给出有证据的判断及可复核的修改建议;本次用户另有明确实现要求时,按其授权范围执行。 ## 输入信息(选填) 两项均可留空,也可直接用一句话说明目标并附上已有资料。无需自行整理版本、配置或完整需求表;能读取的内容由执行者补齐。 列表任务:优先检查当前路由或对话指定的查询表格;明确要求新建或修复时按现有接口实施,未明确实现意图时先审查分页、排序和选择的一致性。 列表或接口资料:读取页面、TDesign Table 类型、请求 DTO、列与字典、权限处理和已有测试,从真实响应确定数据结构与总数。 ## 信息不完整时 先使用本次对话中已经说明的信息;用户留空、写“暂无/不清楚”或未替换输入标记,都按缺失处理,不当作真实路径、参数或业务值。已能从资料确定的内容不重复询问,不编造文件、日志、接口、业务值或执行结果。在用户已授权的范围内读取相关工程和材料,不为补齐输入擅自扩大操作范围。 ### 优先确认 - 查稳定业务主键、分页来源、总数与统计范围,识别对服务端单页再次分页或本地排序的问题。 - 核对筛选、页码、排序到请求参数的映射以及旧响应保护。 - 追踪受控选中值、跨页保留、权限变化和批量接口的执行对象及部分失败响应。 ### 可采用的默认处理 - 沿用当前分页与选中约定;没有规则时仅展示和核对当前页记录,不擅自扩大为全查询结果批量操作。 - 使用服务端提供的稳定键和真实总数,未知总数不伪造,状态用文字表达并保留未知原值。 - 缺数据规模时以现有样本验证长文本、固定列和窄屏,不预设虚拟化或性能指标。 ### 必须有依据的事项 - 总数或排序到底对应当前页、全查询结果还是权限范围不清,不能自行确定统计口径。 - 批量动作的当前页、跨页或全量对象范围和部分失败重试规则无法确认,不能实际发起该写操作。 只有缺口会改变业务结果、权限边界或关键实现,且无法从现有资料确认时,才集中提出最多 3 个关键问题;说明影响,并继续完成不依赖答案的部分。一般命名、排版和可逆实现细节按现有约定决定,不逐项等待确认。 ### 资料仍不足时的交付 - 缺后端协议时交付可确认的列与参数映射、状态和查询竞态方案,未知总数及批量结果留待接口确认。 - 只有接口时提供标明边界的核心前端实现与边界用例,不虚构接口外字段。 ## 执行要求 按当前版本的 TDesign Table 能力实现业务表格。服务器分页、统计口径及权限以本项目约定为准,不把组件默认行为视为业务需求。 1. 先明确列表记录的稳定主键、总数含义、筛选字段、排序范围与分页方式。区分当前页数据、全部查询结果及统计卡片口径,检查页面是否对服务器已经分页的数据再次进行本地分页。 2. 为行指定可靠标识,核对列配置与真实数据类型。日期、金额、状态分别按业务含义展示;长文本提供查看方式,关键标识和主要操作不得被无解释地截断,也不要用彩色标签代替完整状态文字。 3. 将分页、排序、过滤事件映射到接口参数,说明筛选变化后是否回到第一页。处理快速连续查询产生的响应顺序,避免先发后到的旧数据覆盖新条件;查询失败时不得把旧结果伪装成新条件的有效结果。 4. 明确勾选是当前页有效、跨页保留还是针对全部查询结果。使用受控选中值保持组件与业务一致,核对分页保留选中配置;筛选变化、权限变化和数据删除后及时处理失效记录,提交前显示实际操作对象范围。 5. 为首次加载、刷新、空结果、网络失败、无权限和部分操作失败设计可理解的反馈。批量动作完成后同步行状态、数量及选中项,部分失败时给出失败对象与原因,不能只显示一个含糊的“操作成功”。 6. 在实际业务数据长度下验收表头、固定列、横向滚动、列宽和窄窗口。验证分页末页删除、跨页勾选、全部取消、重复点击、排序后勾选保持及筛选后批量操作,同时查看真实请求和服务端返回。 ## 交付与验收 输出:数据口径与参数映射表、表格核心实现、选中规则、状态设计及验收记录。每个缺陷写清触发操作、实际结果、期望结果和修改位置。缺少后端协议时先列出待补充字段,并提供有明确假设的前端方案,不虚构总数或批量执行结果。 ### 本条完成检查 - 输出数据口径、请求映射、稳定键及选择规则;实施时提供对应核心代码。 - 验证末页删除、排序后选择、跨页选择、筛选变化、连续请求和权限变化。 - 核对批量执行的真实对象、成功失败明细及刷新后数量,检查固定列、滚动和中文内容。 按本条要求组织结果,使用简洁中文和一致的编号、术语、缩进及空行;已有项目格式优先。只说明实际完成的内容,将采用的假设、未完成项和缺少的条件写在相关位置,不额外生成无关文档。未执行、无法复现或缺少证据的检查如实标注,不宣称已通过或已有性能收益。 ## 参考资料与适用边界 官方来源(2026-09-08 核验): - [腾讯 TDesign《TDesign Vue Next Table 类型与接口说明》](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/table/type.ts)
将业务字段、校验和保存状态落到 TDesign Form,检查动态字段、异步校验、重置语义以及失败后的可恢复操作。
## 任务目标 请根据已知业务流程和字段契约,开发或审查本次 Vue 业务表单。 以核查和评审为主,给出有证据的判断及可复核的修改建议;本次用户另有明确实现要求时,按其授权范围执行。 ## 输入信息(选填) 两项均可留空,也可直接用一句话说明目标并附上已有资料。无需自行整理版本、配置或完整需求表;能读取的内容由执行者补齐。 表单任务:从当前页面的新建或编辑入口识别业务表单,先对照字段与保存契约审查;用户明确要求开发或修复时,继续完成规则已明确的实现。 表单或字段资料:查页面、接口请求与响应、类型、字典、权限、回填代码和现有测试,按已安装版本读取 TDesign Form 能力。 ## 信息不完整时 先使用本次对话中已经说明的信息;用户留空、写“暂无/不清楚”或未替换输入标记,都按缺失处理,不当作真实路径、参数或业务值。已能从资料确定的内容不重复询问,不编造文件、日志、接口、业务值或执行结果。在用户已授权的范围内读取相关工程和材料,不为补齐输入擅自扩大操作范围。 ### 优先确认 - 提取字段类型、必填条件、长度范围、默认值、清空语义、只读条件与提交名称。 - 检查 Form 数据、FormItem 名称、validate 返回值、远程唯一性及过期响应处理。 - 追踪新增编辑详情、初始快照、隐藏字段、重置和失败恢复,核对实际请求中的日期金额枚举。 ### 可采用的默认处理 - 优先复用现有字段规则和接口,不凭必填星号推断业务约束,明确区分 0、false、空字符串与未提供。 - 初次进入不集中报错,按现有交互使用输入、失焦及提交校验;明确通过后才保存。 - 提交失败保留合理输入,前端防重不代替后端校验和授权;未要求开发时默认不改业务表单。 ### 必须有依据的事项 - 隐藏或清空字段是否参与提交、金额日期转换或新增默认值缺少真实业务定义,不能随意补值或删除。 - 字段修改权限及远程唯一性失败的业务处理无法确定时,不能自行放行保存。 只有缺口会改变业务结果、权限边界或关键实现,且无法从现有资料确认时,才集中提出最多 3 个关键问题;说明影响,并继续完成不依赖答案的部分。一般命名、排版和可逆实现细节按现有约定决定,不逐项等待确认。 ### 资料仍不足时的交付 - 规则不全时先完成已知字段表、布局、状态处理和测试设计,将影响保存的未决项集中列出。 - 没有工程但接口明确时提供可检查的核心组件和请求示例,真实版本与联调结果注明待验证。 ## 执行要求 按当前版本的 TDesign Form 能力实现表单,字段权限、数据提交和重复操作处理须与本项目业务规则一致,不能只依赖组件默认行为。 1. 先把每个字段的业务含义、类型、必填条件、默认值、长度或范围、只读条件及提交名称整理成表。区分空字符串、零、false 和未提供,尤其说明编辑时哪些字段允许清空,不能凭视觉上的必填星号推断规则。 2. 对照实际版本配置 Form 数据、FormItem 字段名称和校验规则。需要跨字段判断时明确关联关系;条件隐藏字段要明确是否保留旧值、是否参与校验和提交,不能让看不见的字段持续阻止保存。 3. 设计校验触发时机,区分输入变化、失焦和提交。正确处理 validate 或提交事件的校验结果,只在明确通过时调用保存接口;远程唯一性校验需要识别过期响应,不能把网络超时当成字段已经可用。 4. 区分新增、编辑、详情状态,确定“重置”是清空还是恢复初始数据,并使用对应能力。异步加载编辑数据后核对初始值快照,再次打开表单时不得出现上一条记录的值或错误提示。 5. 完成保存中的按钮状态、重复触发处理、成功反馈和接口失败反馈。字段错误落在对应输入项,整体失败保留已填写内容并给出恢复方法;前端状态限制需要与服务端业务校验一致,不能代替服务端授权。 6. 逐项验收正常提交、缺失必填、边界值、非法格式、动态条件切换、远程校验失败、重复点击、回车提交及重置。验证日期、金额和枚举转换后的实际请求数据,禁止只看页面显示就断言数据正确。 ## 交付与验收 输出:字段规则表、状态与交互表、核心组件代码、请求示例、验收记录。代码缺失时说明推断范围;规则不明确时列出影响保存的待确认项,先完成不依赖这些项的结构,不自行编造业务枚举和接口字段。 ### 本条完成检查 - 交付字段规则、隐藏重置策略、表单状态、核心代码或审查缺陷及请求映射。 - 验证缺失、边界、非法格式、条件切换、远程校验失败、重复点击、回车和记录重开。 - 以实际请求核对日期、金额、枚举及空值,不能只看显示或组件校验通过判断业务正确。 按本条要求组织结果,使用简洁中文和一致的编号、术语、缩进及空行;已有项目格式优先。只说明实际完成的内容,将采用的假设、未完成项和缺少的条件写在相关位置,不额外生成无关文档。未执行、无法复现或缺少证据的检查如实标注,不宣称已通过或已有性能收益。 ## 参考资料与适用边界 官方来源(2026-09-08 核验): - [腾讯 TDesign《TDesign Vue Next Form 类型与接口说明》](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/form/type.ts)
核查 TDesign Vue Next 的组件引入、基础样式、构建体积和浏览器兼容,适合 Vue 3 企业后台初始化或接入复核。
## 任务目标 请为当前 Vue 3 系统制定 TDesign Vue Next 接入方案,或复核已有接入。 以核查和评审为主,给出有证据的判断及可复核的修改建议;本次用户另有明确实现要求时,按其授权范围执行。 ## 输入信息(选填) 两项均可留空,也可直接用一句话说明目标并附上已有资料。无需自行整理版本、配置或完整需求表;能读取的内容由执行者补齐。 组件库接入目标:有 TDesign Vue Next 时复核现有注册、样式和产物;已明确要求接入时按当前业务页面使用比例选择最小方案,无明确迁移需求则不替换已有组件库。 工程或页面资料:读取 Vue 工程入口、路由、package.json、锁文件、自动导入及样式配置,复用现有浏览器支持和构建脚本。 ## 信息不完整时 先使用本次对话中已经说明的信息;用户留空、写“暂无/不清楚”或未替换输入标记,都按缺失处理,不当作真实路径、参数或业务值。已能从资料确定的内容不重复询问,不编造文件、日志、接口、业务值或执行结果。在用户已授权的范围内读取相关工程和材料,不为补齐输入擅自扩大操作范围。 ### 优先确认 - 确认桌面 Vue 3 适用范围、现有组件库、常用控件及重复能力。 - 核对注册方式、解析器、函数式调用和全局样式加载,确认现有按需方案是否完整。 - 读取构建和目标浏览器配置,检查生产资源、外部脚本版本及样式重置的布局影响。 ### 可采用的默认处理 - 默认复核已有接入,不因提示词出现 TDesign 就迁移 Vue 2、小程序或其他组件库。 - 优先保留能正常工作的全量或按需方式,无产物收益证据时不加自动导入插件。 - 采用锁文件中的兼容版本和既有业务页面验证,缺体积基线只记录当前产物,不填提升比例。 ### 必须有依据的事项 - 当前技术栈与桌面 Vue 3 TDesign 不兼容,而达成目标需要未经明确要求的框架或组件库迁移。 - 新库必须支持的目标浏览器或关键控件行为与现有约束冲突,无法据工程确定取舍。 只有缺口会改变业务结果、权限边界或关键实现,且无法从现有资料确认时,才集中提出最多 3 个关键问题;说明影响,并继续完成不依赖答案的部分。一般命名、排版和可逆实现细节按现有约定决定,不逐项等待确认。 ### 资料仍不足时的交付 - 没有工程时交付最小接入示例、注册和样式检查点,注明仅适用桌面 Vue 3。 - 没有构建或浏览器环境时给涉及文件与验证命令,首次弹窗、直达刷新及产物兼容标为待测。 ## 执行要求 接入范围限定为桌面端 Vue 3 与 TDesign Vue Next。项目使用 Vue 2、其他组件库或小程序时,先指出不适用部分,不直接替换工程依赖。 1. 确认真实入口、路由、样式加载顺序、组件使用比例和目标浏览器。列出已有组件库及重复能力,判断采用 TDesign 是新增统一组件还是局部接入,避免同一业务控件在不同页面出现多套行为。 2. 按实际使用范围选择全量注册、显式按需引入或自动导入。说明选择依据与维护成本,不把按需引入当成无条件要求;只有产物分析能证明收益时,才为体积目标增加相关插件。 3. 核对包版本、解析器和构建插件,使用项目锁文件固定可复现依赖。检查生产构建是否依赖未固定版本的外部脚本或样式;需要外部资源时列明来源、版本和不可用时的业务影响。 4. 确认基础全局样式已加载,检查自动导入是否同时处理组件和函数式调用。对输入框、选择器、表格、弹窗各做一个真实页面引用,识别缺样式、重复样式、组件未注册及编辑器提示失效等问题。 5. 复核样式重置与现有布局的关系,特别检查盒模型、弹层、滚动区域和中文标签。使用有业务含义的页面内容,不增加装饰性标语、虚构统计数据或大面积炫光;布局保持对齐、层级清楚、操作集中。 6. 通过项目既有构建命令生成产物,检查包体、资源请求和相关浏览器中的真实页面。分别记录首屏正常、路由切换、按需弹窗首次打开及刷新后直达页面的结果,失败时保留具体报错和复现路径。 ## 交付与验收 输出:接入方式及理由、涉及文件与配置、依赖版本、产物对比、页面验收结果。性能结论必须包含实测条件;缺少基线只给采集方法。无法运行时,标记所有待验证项并提供最小接入代码,不虚报浏览器兼容或上线完成。 ### 本条完成检查 - 明确接入方式、理由、版本、文件和样式入口,检查组件及函数式调用均可用。 - 用真实页面覆盖输入框、选择器、表格和首次弹窗,排除未注册、缺样式和重复样式。 - 执行生产构建并记录资源与浏览器页面检查,首屏、切路由和刷新直达分别报告。 按本条要求组织结果,使用简洁中文和一致的编号、术语、缩进及空行;已有项目格式优先。只说明实际完成的内容,将采用的假设、未完成项和缺少的条件写在相关位置,不额外生成无关文档。未执行、无法复现或缺少证据的检查如实标注,不宣称已通过或已有性能收益。 ## 参考资料与适用边界 官方来源(2026-09-08 核验): - [腾讯 TDesign《TDesign Vue Next 安装与使用》](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/tdesign-vue-next/site/docs/getting-started.md)
为现有 Vue 工程制定兼容当前工具版本的规范检查方案,区分新增问题、历史问题与业务修复,保持本地和持续集成检查一致。
## 任务目标 请为当前 Vue 工程接入或审查前端规范检查。 以核查和评审为主,给出有证据的判断及可复核的修改建议;本次用户另有明确实现要求时,按其授权范围执行。 ## 输入信息(选填) 两项均可留空,也可直接用一句话说明目标并附上已有资料。无需自行整理版本、配置或完整需求表;能读取的内容由执行者补齐。 规范治理范围:优先检查当前变更涉及的 Vue 文件与已有规范配置;没有改动清单时先盘点实际生效规则和代表模块问题,明确要求接入或治理后再实施范围内修正。 工程或规范资料:读取依赖及锁文件、ESLint 与格式配置、Vue 单文件组件、提交钩子、CI 和已提供检查日志,自行识别版本兼容关系。 ## 信息不完整时 先使用本次对话中已经说明的信息;用户留空、写“暂无/不清楚”或未替换输入标记,都按缺失处理,不当作真实路径、参数或业务值。已能从资料确定的内容不重复询问,不编造文件、日志、接口、业务值或执行结果。在用户已授权的范围内读取相关工程和材料,不为补齐输入擅自扩大操作范围。 ### 优先确认 - 核对 .vue 模板与脚本解析器、JS/TS、ESLint flat/legacy 配置及实际检查范围。 - 查阿里规则包的真实导出和依赖要求,分清已有约定、公开规则与项目补充。 - 比较业务源码、测试、生成文件的排除方式及本地、提交前、CI 命令是否一致。 - 运行可用的非自动修复检查,将行为风险、维护问题和格式差异按模块归并。 ### 可采用的默认处理 - 默认只读审查配置和问题;明确治理时仅修当前范围,保留未提交工作,不整仓格式化。 - 沿用兼容的版本及格式方案,不为接入品牌规则包而叠加工具,不猜不存在的 Vue 配置导出。 - 生成产物可合理排除,真实业务代码不能扩大 ignore 掩盖;历史告警与新增问题分开处理。 ### 必须有依据的事项 - 现有团队规则互相冲突或所谓格式修复会改变业务输出,而工程没有依据决定应采用的行为。 只有缺口会改变业务结果、权限边界或关键实现,且无法从现有资料确认时,才集中提出最多 3 个关键问题;说明影响,并继续完成不依赖答案的部分。一般命名、排版和可逆实现细节按现有约定决定,不逐项等待确认。 ### 资料仍不足时的交付 - 只有配置时交付兼容性差异、最小接入草案及目标文件覆盖核验方法。 - 没有执行环境时给真实可核对的配置建议与命令,不声称规则已经生效或扫描通过。 ## 执行要求 先核对当前 Vue 工程、现有工具及待接入规则包的兼容关系,不预设不同版本提供相同导出,也不把 React 专属规则应用到 Vue。 1. 读取依赖清单、锁文件、构建入口、Vue 单文件组件和现有检查配置,列明实际版本与已生效的规则。先确认解析器能处理模板、脚本和 TypeScript,再判断需要增加什么,避免重复安装同类工具。 2. 核对阿里规则包的实际导出、依赖范围和接入示例。选择与本工程兼容的接入方式,说明哪些使用公开规则,哪些沿用已有约定,哪些是本次业务补充。资料无法证明的 Vue 配置名称不要猜写。 3. 把检查范围划分为业务源码、测试、配置和生成产物。对生成文件及构建目录合理排除,对真实业务文件保留检查,避免用大范围忽略掩盖新增问题。检查提交前脚本是否会修改不在本次任务中的文件。 4. 运行已有检查并建立问题清单,按潜在行为错误、可维护性问题和纯格式差异区分。逐项指出具体文件和触发规则;同一根因合并解释,不把所有告警都列为高风险故障。 5. 先处理改动范围内问题,保持接口、页面文字和业务计算结果稳定。对需要改变运行行为的修复写明输入、原结果和新结果,不能混在批量格式化中。历史问题按模块安排,避免一次扫描演变成整库重写。 6. 检查本地与持续集成采用的版本、命令和文件范围是否一致。复核自动修复后的差异,针对涉及行为的改动运行相关测试和页面操作;只调整格式时不额外编写与实现重复的测试。 ## 交付与验收 输出:环境与适用规则表、最小配置改动、按模块归类的问题、实际执行结果和未解决项。每个结论标明已验证或待验证,不能用“扫描完成”代替“检查通过”。没有代码或执行环境时,给出可落地配置方案及需要补充的最少信息,不声称已经接入。 ### 本条完成检查 - 列出环境、实际生效规则及适用边界,确认模板、脚本和本次业务文件进入检查。 - 交付按模块归类的问题与最小配置改动,行为修复说明前后结果,格式修复不夹带业务变化。 - 复核最终差异及本地与 CI 一致性,给实际执行结果、历史失败和剩余项,不以扫描完成替代通过。 按本条要求组织结果,使用简洁中文和一致的编号、术语、缩进及空行;已有项目格式优先。只说明实际完成的内容,将采用的假设、未完成项和缺少的条件写在相关位置,不额外生成无关文档。未执行、无法复现或缺少证据的检查如实标注,不宣称已通过或已有性能收益。 ## 参考资料与适用边界 官方来源(2026-09-08 核验): - [阿里巴巴《阿里巴巴前端规约:ESLint 配置说明》](https://github.com/alibaba/f2e-spec/blob/main/packages/eslint-config-ali/README.md)