前端百宝箱
用于前端开发的辅助工具，集成多个功能，帮助前端开发人员提高效率，减少重复工作，提升开发质量。
1.目前功能
- 框选对应前端模板代码生成 CSS 样式结构
- 显示该class对应的css结构
- 点击对应class名，自动跳定位到该class名所对应的css结构位置
- 点击对应属性值，快速定位到该值定义位置或赋值位置
- 根据接口名称api生成dubbo接口定义
- 结合ai实现class定义
- 新增面板，可查看当前项目信息，和工具相应功能介绍
- 引入组件路径快捷跳转，通过框选对应路径，鼠标右键选择components快速查找，自动搜索定位组件文件，针对前缀@或者~路径
2.如何使用
1.快速查看属性值定义赋值位置方法
- 打开任意前端html代码文件
- 鼠标移入对应代码里面的属性值
- 通过Ctrl+鼠标左键点击对应属性值，将自动跳转到该属性值定义位置或赋值位置，如果存在多个位置，则会以弹窗进行选择查看
2.快速生成css结构运行命令方法
- 打开任意前端html代码文件
- 选中需要生成 CSS 样式的代码片段
- 鼠标右键选中快速生成css结构
3.查看该class名称所对应的css结构和跳转定位
- 打开任意前端html代码文件
- 鼠标移入对应的class名称即可查看该class的样式结构
- 通过Ctrl+鼠标左键点击对应class名，将自动跳转到该class名所对应的css结构位置
4.根据接口文档结构生成mock数据（目前只支持一级生成）
- 在接口文档中复制接口文档结构
- 鼠标移入对应的需要生成mock的位置鼠标右键点击打开菜单
- 点击根据接口文档格式生成Mock数据
- 填入复制的结构-回车确认
- 填入需要生成多少条数据-回车确认
3.扩展设置
本扩展提供以下配置选项：
| |
