使用chrome devtools mcp将axure原型重新实现为vue页面

• 创建空项目

创建一个功能完整的移动端应用项目，包含基础的应用框架结构。需实现底部导航栏功能，导航栏应包含三个主要选项卡，分别为"首页"、"列表"和"我的"。确保应用框架具备页面路由管理、状态管理基础架构和响应式布局设计，以适应不同移动设备屏幕尺寸。底部导航栏需实现点击切换页面功能，当前选中项应有明显的视觉标识，并确保在应用启动时默认显示正确的初始页面。

• 安装常用组件

安装`yarn`，使用yarn安装vant , vue-router ,pinia ,swiper ,crypto-js

使用chrome devtools 打开原型页面并分析和创建对应的页面

使用chrome devtools mcp 打开 http://127.0.0.1:32767/start.html#id=a034pw&p=page_2

将页面中的图片替换为svg渐变色块，使用src引用