0

I just landed a new gig with a client with no technical background. They bought a website a while ago and now they want to make changes to it. The problem is the codebase is bloated with redundant files and I can't seem to reach the exact components that I want to edit. I tried using React dev tools and it shows the component tree but not which files they are inside. enter image description here

If there is a way to know which file the component is stored in please let me know. Also, If you have any advice on how to familiarize myself with the codebase fast please feel free to share your experience.

Mahmoud Ali
  • 116
  • 2
  • 2
  • 10

1 Answers1

0

You can click the View source for this element icon.

enter image description here

It will navigate you to source panel of the browser developer tool. You can see the source code of the file and if you Right Click the file, you can get the file path from the dropdown menu.

Since I use webpack, the file path is like this: webpack:///./src/components/sms-code/SmsCode.tsx?5fcf

Lin Du
  • 88,126
  • 95
  • 281
  • 483