Skip to content

Latest commit

 

History

History
31 lines (25 loc) · 1.12 KB

DEBUGGING.md

File metadata and controls

31 lines (25 loc) · 1.12 KB

Debugging

The ideal, streamline, no-nonsense debugging experience for working on the DND Player is to use VS Code and install the following extension:

    Name: Debugger for Chrome
    Id: msjsdiag.debugger-for-chrome
    Description: Debug your JavaScript code in the Chrome browser, or any other target that supports the Chrome Debugger protocol.
    Version: 4.11.3
    Publisher: Microsoft
    VS Marketplace Link: https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome

Once the VS Code Chrome debugger extension is installed, debugging the site is incredibly easy.

Firstly ensure you have the .vscode/launch.json file, that should contain a config similar to this

{
    "type": "chrome",
    "request": "launch",
    "name": "Debug in Chrome",
    "url": "http://localhost:3000",
    "webRoot": "${workspaceFolder}",
    "sourceMaps": true,
}

Now to debug just press F5 (Make sure the packaging server is already running somewhere with yarn start) - a new Chrome window will open and you'll be able to debug, place breakpoints, step through code all natively within VS Code!