-1

Which is the best way to debug JS on a web page .php (after the PHP is executed on the server) with Visual Studio Code? I found some solutions like Debugger for Chrome Extension but they work only with .html file.

Sample of test.php:

<html>
<head>
    <title>Sample</title>
    <script>
        alert("test");
    </script>
</head>
<body>
    <?php
        echo "abc";
    ?>
</body>
</html>

I'm using XAMPP.


I already know the difference beetween client and server side programming.

Giovanni
  • 29
  • 7
  • 1
    The browser has a debugger for JS. (F12) – RiggsFolly Jan 21 '21 at 13:49
  • @RiggsFolly I know but I want something inside VS Code. – Giovanni Jan 21 '21 at 13:50
  • 2
    Javascript is executed by the browser, so you need to debug it there by using the Browser developer tools. You can only debug nodejs in visual studio code (at least that I'm aware of) – gbalduzzi Jan 21 '21 at 13:51
  • WHY you have something in the browser. As you said you already know about the difference between Client and Server side programming. But do you – RiggsFolly Jan 21 '21 at 13:51
  • I want to debug JS in VS Code because it have a better interface than browser developer tools. – Giovanni Jan 21 '21 at 13:56
  • Well you cant, unless you are using NODEJS maybe, which is run on the server – RiggsFolly Jan 21 '21 at 13:58
  • I used the "Debugger for Chrome Extension" for VS Code and it debug JS but only in html. Exist something like "Debugger for Chrome" that debug JS Client Side but for .php page? – Giovanni Jan 21 '21 at 14:04

1 Answers1

3

The Quokka extension for VSCode might help?

https://marketplace.visualstudio.com/items?itemName=WallabyJs.quokka-vscode

It is like having the console inline, you create a new file with your JavaScript (cmd + shift + p > Quokka.js : New File) and it works in real time with annotations.

lsg93
  • 76
  • 6