Components Seacher

背景

在实际开发场景中，开发者需要在页面（pages）或自定义上层组件中引入各个功能组件（components）。这些组件根据小程序开发规范被记录在页面配置的json文件中，通过tag名引入axml进行传参使用。当：

• 需要快速查看从第三方库引入的组件、自定义组件在哪些page被使用

• 组件内部的某些属性被修改，暴露给外部的参数名称、类型等发生改变，需要在引用处做出相应修改

• 需要统一修改组件的属性值，做到各个页面的一致

• ... ....

而目前编辑器提供的能力只有查找正向引用，也就是在通过页面的标签名称跳转组件定义。在上述情况中，一般的做法是通过全局搜索引用路径进行查找。

为了查找快捷和全面，借助vscode插件强大的能力，开发此组件引用查找插件。

插件功能介绍

1. 界面图展示

   • 侧边栏：TreeView区域

     • 展示当前组件和引用该组件的上层组件/页面
     • extraRowItems

   • 编辑器文档区

     • 高亮引用组件的TagName

   • 导航区域按钮（高亮、刷新、跳转）

2. 快捷键

   快捷键	功能
   "ctrl+R" / "cmd+R"	刷新当前组件 ，重新搜索组件引用
   "ctrl+H" / "cmd+H"	高亮当前文件中被引用的组件 Tag
   "ctrl+U" / "cmd+U"	取消高亮