0

In How to implement `au run --watch` task + debugging Ashley Grant outlines nicely a method (along with other contributors) to launch a browser while debugging in VS Code, but as evident in comments, it appears source mapping doesn't work. Indeed, I got going with that post, but as being a rather n00b with both VS Code and Aurelia, I wonder if anyone has ideas what could make it working? Currently I have only JS code, but that or TypeScript helpers and pointers are appreciated.

Just in case, here is the tasks.json { // See https://go.microsoft.com/fwlink/?LinkId=733558 // for the documentation about the tasks.json format "version": "0.1.0", "command": "au", "isShellCommand": true, "tasks": [ { "taskName": "watch", "suppressTaskName": true, "args": [ "run", "--watch" ], "isBuildCommand": false, "isBackground": true, "problemMatcher": { "owner": "au", "severity": "info", "fileLocation": [ "relative", "${workspaceRoot}" ], "pattern": { "regexp": "__________", "file": 1 }, "watching": { "activeOnStart": true, "beginsPattern": "^File Changed: (.*)", "endsPattern": "/(?:BrowserSync Available At:)|(?:Finished 'reload')" } } } ] } and here is the launch.json { "version": "0.2.0", "configurations": [
{ "type": "chrome", "request": "launch", "name": "Launch Chrome against localhost", "url": "http://localhost:9002", "webRoot": "${workspaceRoot}", "preLaunchTask": "watch" }, { "type": "chrome", "request": "attach", "name": "Attach to Chrome", "port": 3003, "webRoot": "${workspaceRoot}" }, { "type": "firefox", "request": "launch", "name": "Launch Firefox against localhost", "url": "http://localhost:9002", "webRoot": "${workspaceRoot}", "preLaunchTask": "watch" }, { "type": "firefox", "request": "attach", "name": "Attach to Firefox", "port": 3003, "webRoot": "${workspaceRoot}" } ] }

Veksi
  • 3,556
  • 3
  • 30
  • 69
  • I'm not sure if there is an answer to this for now, other than use Chrome for debugging from VSCode. I have a great debug experience with Aurelia + TypeScript + VSCode + Chrome. My launch.json is basically the same as yours. But for Firefox I can't make it work. Here is the same problem but coding for React https://stackoverflow.com/questions/49170483/vs-code-debugger-config-to-debug-react-in-firefox. Had problems with FF and debugging from VSCode from the start. Earlier FF hit breakpoints but sourcemaps failed to load correctly. Now it looks like the sourcemaps are OK, but no breakpoints. – robs Apr 28 '18 at 06:47

1 Answers1

0

Not sure if this is what you are looking for, but this is the only way I got working to debug JavaScript in an Aurelia application with VSC.

Works only with Chrome, no luck with Firefox so far.

A JavaScript file must be open and it must be the active editor in VSC for the debugger to use the right path. Breakpoints will work (only) for all JavaScript files in that same directory.

Command line:

au run --watch

launch.json:

 "configurations": [
   {
     "type": "chrome",
     "request": "launch",
     "sourceMaps": true,
     "trace": true,
     "name": "Aurelia App in Chrome (for currently open JavaScript file)",
     "url": "http://localhost:9000/index.html",
     "webRoot": "${fileDirname}/.."
   },
   ...
StaticNoiseLog
  • 1,370
  • 17
  • 27