web-development

🌐 全栈级前端工程化开发专家

来自腾讯云CloudBase官方团队的前端工程技能,专注React/Vue/Vite现代Web开发,提供从代码实现到部署验证的完整工程化流程与TypeScript严格规范。

收藏
14.4k
安装
4.8k
版本
1.27.25
CLS 安全扫描中
预计需要 3 分钟...

使用说明

核心用法

web-development 是腾讯云CloudBase技能体系中专门面向Web前端工程开发的权威技能,覆盖现代前端技术栈的完整生命周期。该技能明确适用于产品方向已确定后的工程执行阶段,而非视觉探索或原型设计阶段。

主要应用场景

1. 框架工程实现:React/Vue组件与页面开发、Vite项目搭建与维护
2. 构建与部署:前端打包配置、CloudBase静态托管集成、自定义域名配置

3. 调试与验证:浏览器端流程测试、路由验证、回归检查

4. 平台集成:CloudBase Web SDK接入、认证集成、数据层对接

关键执行规范

该技能强制要求工程宪法级别的开发纪律:

  • TypeScript零容忍:禁止任何形式的any类型绕过,要求通过unknown+类型收窄或精确接口定义解决类型问题
  • 双重验证机制:任何非平凡变更必须通过「静态层(tsc/eslint/build)」和「运行时层(agent-browser实测)」双重验证
  • 变更安全协议:代码变更前必须声明影响范围、获取用户确认、执行事后验证
  • 部署门禁检查:静态托管发布前必须完成部署门禁协议

边界与协作

  • 前置依赖:涉及UI样式/布局/配色时,必须先加载`ui-design`技能输出设计规范,禁止直接编写CSS
  • 协作技能:登录流程对接auth-tool-cloudbase/auth-web-cloudbase、微信支付对接cloudbase-wechat-integration、数据库操作对接对应database技能
  • 明确排除:小程序开发、纯后端服务、视觉方向探索

CloudBase集成要点

  • 优先npm安装@cloudbase/js-sdk,CDN仅用于静态HTML场景
  • SPA History模式关键配置:必须通过MCP工具将静态托管404错误文档设为index.html,否则子路由刷新直接404
  • 保持SDK实例单例化,禁止重复初始化

显著优点

1. 企业级工程规范:内置腾讯云CloudBase团队的生产环境最佳实践,TypeScript严格程度达到工业级标准
2. 全流程覆盖:从本地开发、类型检查、构建、浏览器验证到部署门禁的完整闭环

3. 平台深度集成:原生支持CloudBase静态托管、Web SDK、认证体系的一键式接入

4. 防错机制完善:强制浏览器实测(agent-browser)杜绝"编译通过即完成"的虚假交付

5. SPA路由痛点专项解决:明确识别并强制配置History模式SPA的404回退,避免常见部署陷阱

6. 技能体系化协作:与ui-design、auth、wechat-integration等技能形成完整矩阵,避免功能重复描述

潜在缺点与局限性

1. 前置条件严格:要求产品方向已确定,不适合探索性开发;UI工作必须先加载design技能
2. 验证门槛较高:强制浏览器实测可能因环境凭证、后端依赖、付费API等因素无法完整执行

3. 技术栈倾向性:默认优选Vite+React/Vue,对传统Webpack项目或Svelte/Angular等框架无明确指引

4. 平台绑定性:CloudBase深度集成对非腾讯云用户价值受限,静态托管、SDK等章节需选择性使用

5. 无设计能力:明确剥离视觉设计职责,纯工程实现导向

6. MiniProgram exclusion:小程序开发完全外移至独立技能,Web技能不越界

适合的目标群体

  • CloudBase平台开发者:需要快速接入腾讯云静态托管、Web SDK、认证体系的项目团队
  • 中小前端团队:缺乏成熟工程规范,需要TypeScript严格实践和部署门禁机制的组织
  • React/Vue技术栈工程师:使用Vite构建工具,追求现代开发体验的开发者
  • 全栈开发者:需要从前端到部署的一体化工程方案,减少跨环节沟通成本
  • 技术负责人:需要 enforceable 的代码质量和验证标准,避免"写完即交付"的低质量输出
  • 教育场景:作为企业级前端工程规范的教学模板,展示工业级TypeScript和CI实践

使用风险

性能与构建风险

  • 强制tsc --noEmit和完整构建验证可能显著延长开发反馈周期,在大型单体仓库中尤其明显
  • Vite默认配置未必适配所有浏览器兼容性要求,需自行评估polyfill和legacy配置

依赖与生态风险

  • CloudBase SDK版本迭代可能影响API稳定性,需关注@cloudbase/js-sdk更新日志
  • 浏览器实测依赖agent-browser工具可用性,该工具若存在环境限制则核心验证环节断裂

部署与配置风险

  • History模式SPA 404配置遗漏:技能虽强调此点,但人工执行MCP工具仍可能出错,导致生产环境路由失效
  • 静态托管默认不部署到根路径,需显式确认用户意图,避免意外路径问题

协作断裂风险

  • 未先加载ui-design直接写样式将导致"退化为通用AI模板默认样式",产生返工
  • 认证/支付等边界功能若错误地在本技能内实现而非路由至专用技能,将造成架构混乱

验证盲区风险

  • "无法本地验证时需显式声明"的要求依赖执行者的诚实披露,存在人为遗漏可能
  • 第三方API、付费服务、凭证依赖等外部阻塞因素可能导致"未完成"声明被忽略

技能版本风险

  • 当前版本2.25.6,技能文件通过git raw URL引用,若主仓库结构调整可能导致standalone fallback失效

web-development 内容

手动下载zip · 12.6 kB
browser-testing.mdtext/markdown
请选择文件