将静态 Vue 页面(index.vue)改造为动态页面(Custom.vue)；稿源仅限 index.vue、其引用的 CSS 与资源路径，禁止参考仓库内其他文件。Invoke when user wants to transform a static Vue page into a dynamic data-driven page with Element UI components.
lanhu-code-2-el-vue
功能概述
lanhu-code-2-el-vue是一项面向实际任务的技能，主要用于本 Skill 用于将 静态 HTML 页面改造为 Vue 2 + Element UI 的数据驱动动态页面 ，执行时会直接生成 Custom.vue 文件；When to Use This Skill；
核心要点
- 在以下场景触发本 Skill：；
- 用户要求「静态改动态」「把 index.vue 改成 Custom.vue」「按改造规范改造页面」；
- 将某视图文件。
使用与执行
它将相关步骤、工具调用和结果整理方式集中到统一流程中，帮助使用者更快完成目标并减少重复操作。从功能定位来看，该技能强调把分散的操作要求整理成清晰、可复用的处理流程，使用户能够围绕既定目标快速准备输入、选择执行方式并获得结构化结果。实际使用前应先确认任务范围、数据来源、运行环境、必要权限和关键参数，再依据技能说明逐步执行；若输入条件不完整，应先补齐信息或采用保守配置，避免因错误假设导致结果偏离需求。
结果检查与注意事项
执行过程中需要关注工具调用是否成功、接口或依赖是否可用、输出格式是否符合预期，并对异常提示、缺失字段和边界情况进行处理；涉及批量任务时，还应保存进度，避免中断后重复操作。该技能适合用于一次性任务，也可以接入自动化工作流，与其他技能或上层代理配合完成更完整的业务链路；在组合使用时，应明确每一步的输入输出关系，并避免不同步骤之间出现参数冲突。
lanhu-code-2-el-vue
介绍
本 Skill 用于将静态 HTML 页面改造为 Vue 2 + Element UI 的数据驱动动态页面，执行时会直接生成 Custom.vue 文件。
When to Use This Skill
在以下场景触发本 Skill：
- 用户要求「静态改动态」「把 index.vue 改成 Custom.vue」「按改造规范改造页面」
- 将某视图文件夹下的静态页面改为 Vue 2 + Element UI 动态页面
- 需要循环渲染、Element UI 替换、统一 class 命名、像素级还原设计稿
不适用： 全新页面从零开发、非 Vue 2/Element UI 技术栈、不涉及「静态→动态」改造。
执行指令（核心）
当本 Skill 被触发时，必须按照以下步骤直接执行代码改造，生成 Custom.vue 文件，而不是仅提供指导文档。
唯一信息源（生成 Custom.vue 时必须遵守）
生成/改写 Custom.vue 时，只允许使用以下材料作为页面结构与样式的依据：
src/views/${folderName}/index.vue的源码（模板、脚本、内联样式）。- 由 index.vue 直接或间接引用的样式文件（例如
步骤 6: 改造规范（必须遵守）
6.1 文件操作规范
规则 说明 ❌ 禁止修改源文件 index.vue及其引用的样式文件只能读取，绝对不能修改✅ 只操作目标文件 所有代码只写入 Custom.vue✅ 唯一稿源 结构与样式依据仅限当前 index.vue+ 其引用 CSS + 资源路径；禁止参考其他视图/其他Custom.vue/路由等工程文件生成页面内容✅ 使用 scoped 样式 所有样式必须在