Note: This article is published on 12/15/2024.

This series of articles will discuss debugging for Angular App.

This article will demonstrate how to install and use VS Code Extention: Debuger for Google Chrom,

Introduction

The article, Debug Angular (1), In VS Code by Debugger for Chrome, was written on 01/15/2021, more than 4 years ago. That article is so popular with 208 K readings. That meant the Angular is very popular tool for web development, on the other hand, the angular devugging tech is an issue to get so many developers to pay attention on it. I realize, the VS Code Debugger for Chrome has been deprecated, this article is a supplement of the original article. We will see the original article is still valid or useful.

The content of this article

Debug Angular in VS Code

Now the current VS Code is with v1.95.3. The VS Code Debugger for Chrome is deprecated:

.However, user is introduced to use the JavaScript Debugger extension instead. Click the link, we can see that

this extension is already installed if you use VS Code or Visual Studio:

And furthermore,

Nightly Extension you may want to install our nightly build to get the latest fixes and features. The nightly build runs at 5PM PST on each day that there are changes. You can get Nightly extension from JavaScript Debugger (Nightly) - Visual Studio Marketplace, or search in VS Code extension for

@id:ms-vscode.js-debug-nightly

to get:

Debugging in VS Code

Actually, the debugging is the same way as we introduced in article, Debug Angular (1), In VS Code by Debugger for Chrome, we will not repeat the process, but given here the major points:

References