Logo Questions Linux Laravel Mysql Ubuntu Git Menu
HTML CSS JAVASCRIPT SQL PYTHON PHP BOOTSTRAP JAVA JQUERY R React Kotlin
 

Open console source mapped file in external editor

Tags:

google-chrome-devtools

When you use source maps on errors, the Chrome Developer Tools console shows links to the source file.

Is there a way to open these links in an external application (editor)?

For instance, on click or CTRL+click or...

like image 694
smhg Avatar asked Jun 23 '13 11:06

smhg

People also ask

How do I open the console under source?

Press Control + Shift + J or Command + Option + J (Mac). To open the Console from the Command Menu, start typing Console and then run the Show Console command that has the Panel badge next to it.

How do you save an entire folder from Google Chrome's developer tools Sources tab?

Just do right click -> save as html -> in type select (complete webpage).

How do I edit HTML in Chrome dev tools?

By right-clicking on the HTML in the “Elements” tab and selecting “Edit as HTML,” you can make live edits to the markup of a webpage that Chrome will immediately render once you're done editing.

2 Answers

Unfortunately, this isn’t possible yet.

Here are some links that may help:

  • http://sokolovstas.github.io/SublimeWebInspector/
  • https://developers.google.com/web/tools/setup/setup-workflow?hl=en
  • https://www.sitepoint.com/edit-source-files-in-chrome/
  • https://gregrickaby.com/2013/07/turn-chrome-developer-tools-into-an-ide/
  • Sublime text 3 and Web Inspector plugin
  • https://medium.com/google-developers/devtools-tips-for-sublime-text-users-cdd559ee80f8#.wck48zrkz
like image 56
Kirk Strobeck Avatar answered Sep 21 '22 00:09

Kirk Strobeck

Possible in 2020 using Intellij (IDE in my case).

  1. Install "Open in Intellij" extension (Chrome)
  2. Configure as here in docs https://github.com/bernhardc/open-in-intellij

Worked like a charm.

like image 41
Elmatsidis Paul Avatar answered Sep 20 '22 00:09

Elmatsidis Paul
Sign in to Comment

Related questions

Write JavaScript in Chrome developer tools
Inject jQuery into Puppeteer page
Chrome DevTools [chrome://inspect] : 404 Not Found The resource could not be found
Running code snippets from Google Chrome console command line, using (experimental) code snippets feature?
Access function location programmatically
Can I view Session State Value at client-side using Chrome DevTools?
Chrome debugger - how to turn off console.log message grouping?
How to trigger an on scroll event without scrolling
Examine Element That is Removed onblur
How can I measure pixels in Chrome without an extension?
How to reset chrome inspector?
Chrome Developer Tools keeps breaking where no breakpoints are set
How to know in which file that defined a js global var in chrome console?
How to hide Chrome "paused in debugger" overlay?
How to reduce/remove memory leaks in Angular application
Get line number in Elements window of Chrome Developer Tools?
Reducing scroll jank when using overflow-y: scroll;
Chrome dev tools loses network history
Google Chrome for Android Remote Debugging - "localhost:9222" Not Available
Unable to set breakpoints in Chrome dev tools, version 26.0.1410.64 m

Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!