SuperAPI AI 工具集

vite

前端与建站

查看项目

更新于 10-16 09:25

技能介绍

Vite Operations 技能面向 Vite 工具链本身,用于项目发现、配置与插件行为、环境加载、开发服务器诊断、生产构建以及资源与部署边界。应用架构与 UI 实现应交给 frontend-engineering,基础设施与 CI 设计交给 platform-engineering,浏览器测试交给 playwright,无障碍实现与审查交给 web-accessibility。

操作契约

先发现再修改。读取 package.json、锁文件、vite.config.、tsconfig.json、脚本、框架插件与部署假设。从锁文件识别包管理器,不要臆造命令。

检查实际工具链。从本技能或项目根运行 scripts/vite-doctor --json,采集 Node、包管理器、Vite 包、配置与环境证据。文档中的 Vite 版本不能证明已安装版本。

保持配置显式。审查 root、base、resolve.alias、plugins、server.host/port、preview、build.outDir、build.rollupOptions 与 define。将 define 和 import.meta.env 视为编译期/公开数据;切勿把密钥放入 VITE_* 变量或客户端包。

先构建再声称成功。使用项目既有脚本(通常为 npm run build、pnpm build、yarn build 或 bun run build),并设置有限超时。检查输出文件与警告,然后在可能时于部署 base 路径下实际运行构建产物。

将变更视为需授权操作。只读发现可直接进行。安装包、编辑配置、删除输出、启动服务器或更改部署设置前,确认目标、范围与回滚路径。优先使用新输出目录或版本控制变更,绝不覆盖用户未提交的工作。

保持证据有限。概括日志与错误;不要粘贴 .env 内容、令牌、完整包或生成的依赖树。

常见工作流

新项目或迁移:验证 Node 与包管理器,检查现有应用入口,选择框架插件,保留锁文件,仅在目标目录为空或明确批准时使用官方 Vite 脚手架。

配置变更:做最小改动,说明 base 与资源路径为何仍然正确,并运行生产构建。配置文件是可执行代码;不要把任意配置值加载进 define。

环境问题:区分 .env、.env.local、模式特定文件与进程环境。默认仅暴露以 VITE_ 为前缀的变量;更改后重启开发服务器。验证必需值但不打印其值。

开发服务器问题:检查端口/主机/代理以及请求是否同源。其他设备可访问的服务器可能需要显式主机与网络策略审查;不要随意暴露。

构建问题:捕获第一个可操作的错误,检查插件与 Node/Vite 兼容性,仅在批准后清理可复现的缓存,并重跑最小失败命令。不要用宽泛的别名更改掩盖模块解析失败。

部署问题:确认 base、SPA 回退、静态资源缓存与托管平台的输出目录。构建成功不能证明深链接或客户端路由可用。

参考路由

配置、插件、模式、环境变量、别名或公共资源:references/config-and-environments.md

构建输出、依赖失败、性能或部署:references/build-and-deploy.md

开发服务器、代理、预览、诊断或安全操作:references/dev-server-and-diagnostics.md

验证边界

当请求的配置或产物存在、相关命令成功退出且边界已检查时,Vite 任务才算完成:构建检查构建输出,部署检查可达路由与资源,E2E 声明通过 playwright 检查用户可见浏览器行为。明确说明任何未测试的浏览器、主机、模式或部署假设。

何时不使用

前端组件架构、状态、响应式 UI 或一般 Web 实现:frontend-engineering。

基础设施、CI 运行器、容器、托管拓扑或发布策略:platform-engineering。

编写或操作浏览器自动化:playwright。

WCAG 审计、无障碍交互设计或语义无障碍修复:web-accessibility。

Rollup 内部机制或非 Vite 打包器迁移:使用相关工具或方法论技能;现有 Vite 项目的 Vite 特定行为仍可参考。