浏览代码库和查找网页源代码的好方法是什么

What's a good way to navigate code base and find source for a webpage

我是前端开发的新手,正在考虑在我们的网页代码库中查找源代码的好方法。我通常做的是转到 chrome 开发工具中的元素选项卡,找到一个特殊的 class 名称,然后在代码库中搜索它以找到该文件。我觉得应该有更好的方法来完成这项任务。我尝试在开发工具中使用源选项卡,但它在导航栏中显示了大量文件和文件夹。我也尝试使用 Components 选项卡,因为我们使用的是 React,但组件名称被缩小为单个字母。所以想从你们那里得到建议。你通常怎么做?谢谢!

有很多方法可以找到源代码或调试代码

①You can use Chrome dev tool
②You can use debbuger in VS
③you can debug your code by puttin debugger in java script code
④browser has good functionality to find code(For reference please check Image.)

您的想法是正确的,问题是您正在查看网站的 minified(大概是生产版)版本。通常,在开发网站时,您 运行 一个开发服务器,其中所有代码(大部分)显示为您 IDE/editor 中编写的代码。这样您就可以通过 chrome 开发工具找到组件名称并检查源代码。

您应该与当前负责代码的人联系,以帮助您在您的计算机上获得开发服务器 运行ning。然后,您找到组件名称,然后通过 IDE/editor 进行“在文件中查找”搜索以查看它们是什么,以及它们在代码库中的使用位置。您可能需要筛选许多结果。这对于大型代码库中的课程来说是一样的,直到您更加熟悉哪里发生了什么。甚至之后。

我会说;即使是看似简单的事情也可能非常复杂,因此如果代码的所有者可以粗略地概述事物的组织方式以及为什么可以更轻松地浏览代码库,那将对您很有用。但是,它总是有点困难,并且取决于代码的整洁程度,它可能几乎是不可理解的。祝你好运。