#VISUAL STUDIO CODE DEBUG SOURCE CODE INSTALL#

Personally, I would caution against submitting anything in the. One user’s settings could conflict with another’s, potentially breaking workspaces. Typically, it’s a best practice to avoid committing user-specific config files to source control. It looks like other non-Microsoft VS Code extensions are available for Firefox, PhantomJS, and Safari on iOS, but the launch.json config looks different. Microsoft publishes the Debugger for Chrome and Debugger for Edge extensions for this sort of debugging. The original guide provides screen shots to better illustrate these steps. Once the debugger is attached, you can step through the code, view variables, set breakpoints etc. Any time execution hits a breakpoint, execution will stop and let VS Code step through it. My preference it to open up a new instance of Visual Studio it feels a bit to much like inception to debug the code generation in the same instance of Visual Studio but this comes down to whatever works for you. Note that the app must already be running before the debugger is launched! (This point is not entirely clear in the official guide.) The debugger will launch the Google Chrome browser and load the URL provided in the launch.json config. 'name': 'Launch Chrome against localhost', The launch.json file should look like this, with values changed to reflect your environment: Run the VS Code debugger “launch” job against the app (by clicking the green arrow in the Debug view).Launch the Angular app separate from the debugger (such as by running “ng serve” from the command line).vscode/ launch.json file (example below). Set an appropriate config spec in the.Create a launch.json config file (by clicking the gear icon in the Debug view).

#VISUAL STUDIO CODE DEBUG SOURCE CODE INSTALL#

Install the Debugger for Chrome extension in VS Code.Make sure VS Code, Google Chrome, and all the Angular parts are already installed.(This guide is really helpful for other VS Code Angular topics, too.) The basic steps are: To set up debugging, simply follow the steps in the Debugging Angular section of the official Using Angular in VS Code guide. Their powers combined let you not only develop Angular app code but also debug it through the editor! VS Code debugging even works for TypeScript. Visual Studio Code is a great source code editor. Angular is a great front-end framework for web apps.

Visual studio code debug source code