刚接触牧场主的时候，每天头皮发麻，项目的技术栈太偏，文档ember.js基本都是英文的，有些老的是中文的。

复杂的项目结构

很多变量和组件都是全局注入的，所以很难找到源头。

路由没有统一管理。

使用hbs模板解释器，html中使用了大量变量，破坏了结构，难以理解。

组件的加载和编译方法与当前主流的vue组件和react组件有很大的不同。

为了技能

全局搜索ctrl shift f文件搜索ctrl p重要条目文件/app/router.js记录文档

00-1010使用全局搜索时，应根据页面的唯一标识符进行全局搜索，如标题、关键词等不同于其他页面的内容，或其他页面中没有出现的本页面独有的资源。如果是文本，一般会找到它的国际化定义文件。牧场主的ui页面没有中文，所有中文都是通过配置国际化文件显示的。

搜索的思路是页面logo字段=国际化定义文件=字段定义文件=找到hbs文件。

如果您需要一个页面，该页面有一个名为“部署应用程序”的按钮。

lib/pipeline/addon/components/step-summary/template . HBS是我们要找的页面。

文件搜索

一些文本指向一个文件，此时，我们将使用文件搜索。使用ctrl p在windows下的vscode中搜索。

如下图所示，这里的设置指向一个设置。虽然你可能不太了解服务()的用途和方法，但是可以通过Ctrl P找到。

设置相关定义文件

搜索结果如下，其中lib shared app settings service . js和lib shared addon settings service . js看起来最像我们要找的文件。

因为这个文件的路径包含两个关键字段，设置和服务，这使得文件发挥作用，想象力也很重要。

全局搜索

/app/router.js是这个项目的路由配置文件。一级和二级路径在该文件中定义，长路由转换为短路路由。

我们在浏览器地址栏看到的是短路原因。利用这个短路原因找到长路线和路线对应的文件夹才是正确的思路。

诸如

在浏览器中，短路径G对应长路径globa-admin，文件加lib/global-admin，长路径对应文件夹名。

路径中仍有一些页面需要授权，还有一些不需要授权。你可以看看后面，我会写更多关于路线分析和快速定位的文章。

寻找关键文件

俗话说，好记性不如烂笔头。在项目探索研究阶段，一定要多记，沉淀成文件，不仅是为了帮助自己，也是为了帮助后代。

即使是现在，我也经常要检查之前写的文档，相当于一个检查表。

rancher/ui项目的所有组件都是开发人员自己开发的，没有引用第三方成熟的组件库。因此，这个项目非常大。但是不要怕，他们的开发者很友好，我给他们的两个问题反应很快，解决了我的问题。

祝你在牧场主的发展中取得成功。