0
200
Viewshow to navigate to the source file when debugging js in google chrome
I am using the google chrome to debugging the javascript source file, now I could debbugging the output js file, but the output js file is not human friendly readable. It looks like this:
from the google chrome console, I can see the call stack, and the google chrome tips shows that the source map are avaliable. But how to navigate the the js source file with current debugging line? I already type command + P in macOS but just shows the source files, I did not know which line should to navigate. the call stack only show the output js file line number.
2 answers
Answer question0
Next to the "Page" tab (you can make the side bar bigger or click on those two arrows, there you will find the "Filesystem tab". If you add the corresponding folder to the workspace you will be able to edit and save those files.
Here's an article that explains it in details using a python server.
(note that you can use any local server you'd like)
(note that it won't work with local files url like file:///)
0
If you are trying to debug your current JS file at line 23487, steps would be to-
- Load URL.
- Open chrome debugger tools.
- Put debug point on desired line.
- Reload the URL, the debugger will pause at debug point.
You can watch below video for this, specifically @10:40 timestamp.