Debugging Laravel application on VSCode

Question

Has anyone successfully configured VSCode to debug Laravel-based website? After having followed numerous articles and tutorials, I have made it to the point where I can ask VSCode to "Listen to XDEBUG", but I haven't been able to do normal VS-style debugging where I could just hit F5 to launch current the website in my favorite browser and it would break into VSCode when it hit a breakpoint, just like we do in full Visual Studio or Eclipse.

I have following things correctly setup on my machine:

VSCode 1.25.1
XAMPP 1.8
XDEBUG (configured and working)
PHP Debug extension for VSCode

I'm not sure what launch configuration do I need to use in my launch.json. The two configurations that come with PHP Debug extension look like this:

{
    "name": "Listen for XDebug",
    "type": "php",
    "request": "launch",
    "port": 9000
},
{
    "name": "Launch currently open script",
    "type": "php",
    "request": "launch",
    "program": "${file}",
    "cwd": "${fileDirname}",
    "port": 9000
}

While the first configuration works correctly (I can start debugging in that mode in VSCode, then launch my website separately in the browser and it hits the breakpoints), the second configuration fails. It tells me that it cannot locate Controller class (which is a Laravel framework class). Qualifying class name with namespace doesn't do any good either.

My guess is that this has got something to with how the launch configuration is setup. It tries to launch the active script as an independent unit and thus fails to locate the definition of framework classes located in different files. We have to somehow provide launch the website as a single application.

Has anyone done that successfully and tell me what I'm missing here?

"the second configuration fails. It tells me that it cannot locate Controller class... " Well ... of course it will fail. You are trying to execute your controller (or whatever other current class you are working on) directly ... while bypassing whole framework load procedure (in other words, it's not handled via standard index.php) and no composer's autoloader. If you want to initiate whole thing from VSCode (debugger + open URL in browser) .. you will have to hardcode your URL in your Launch config (if that's possible, of course) — LazyOne
– LazyOne, Commented Aug 4, 2018 at 17:11

dotNET · Accepted Answer · 2021-08-09 07:39:40Z

21

Finally got it working. Here are the things if anyone else needs it.

Make sure you have XDEBUG set up and running on your Apache server.
Install debugger extension for your favorite browser. Extensions are available for Chrome, Edge and FireFox (can be searched and installed from within VSCode).

Set up launch.json so that it launches two configs in parallel. This is done through so-called compound configurations. Here is mine that launches PHP + XDEBUG and EDGE browser:

 {
     "version": "0.2.0",
     "compounds": [
         {
             "name": "Launch & Debug",
             "configurations": [ "Launch Program", "Launch localhost" ]
         }
 ],
 "configurations": [
     {
         "type": "php",
         "request": "launch",
         "name": "Launch Program",
         "cwd": "${workspaceRoot}",
         "port": 9000
     },
     {
         "name": "Launch localhost",
             "type": "edge",
             "request": "launch",
             "url": "http://localhost/public",
             "webRoot": "${workspaceRoot}"
         }
     ]
 }

Update the above config according to your local settings such as site address, xdebug port etc.
Press F5 and your debugging session will start. Browser will launch automatically and you'll be able to hit your breakpoints.

edited Aug 9, 2021 at 7:39

answered Aug 7, 2018 at 12:27

dotNET

35.7k29 gold badges176 silver badges276 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Alexander Leon Bulatov Over a year ago

This is awsome! Thank you for your effort to down this magic) But one thing was emerged for me how to change a browser in case I have an opened browser.

dotNET Over a year ago

@AlexanderLeonBulatov: The two attributes type and request can be used to do this. Set the type attribute to edge or chrome, whichever u have. Set request to attach instead of launch to use already open browser.

Collectives™ on Stack Overflow

Debugging Laravel application on VSCode

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related