Getting started with Angular 2 Dynamically add components using ViewContainerRef.createComponent Pipes Routing (3.0.0+)Http Interceptor Directives Installing 3rd party plugins with [email protected]Testing an Angular 2 App Routing Optimizing rendering using ChangeDetectionStrategy Lifecycle Hooks Directives & components : @Input @Output Angular RXJS Subjects and Observables with API requests Zone.js Services and Dependency Injection Angular 2 Forms Update Detecting resize events Bootstrap Empty module in angular 2 Advanced Component Examples Bypassing Sanitizing for trusted values Angular2 Custom Validations Angular 2 Data Driven Forms Angular - ForLoop Feature Modules Angular2 In Memory Web API Ahead-of-time (AOT) compilation with Angular 2 Debugging Angular2 typescript application using Visual Studio Code CRUD in Angular2 with Restful API Component interactions Use native webcomponents in Angular 2 Lazy loading a module Update typings Mocking @ngrx/Store How to use ngfor ngrx Animation Commonly built-in directives and services How to Use ngif Testing ngModel Create an Angular 2+ NPM package Angular2 CanActivate Angular 2 - Protractor Example for routes such as /route/subroute for static urls Angular2 Input() output()Page title unit testing Angular-cli OrderBy Pipe Angular2 Animations Angular 2 Change detection and manual triggering Angular2 Databinding Brute Force Upgrading EventEmitter Service Angular2 provide external data to App before bootstrap Using third party libraries like jQuery in Angular 2 Component interactions Attribute directives to affect the value of properties on the host node by using the @HostBinding decorator.Templates Configuring ASP.net Core application to work with Angular 2 and TypeScript Angular2 using webpack Angular material design Dropzone in Angular2 custom ngx-bootstrap datepicker + input angular redux Creating an Angular npm library Barrel angular-cli test coverage Service Worker Components Modules

Debugging Angular2 typescript application using Visual Studio Code

Launch.json setup for you workspace

Turn on Debug from menu - view > debug
it return some error during start debug, show pop out notification and open launch.json from this popup notification It is just because of launch.json not set for your workspace. copy and paste below code in to launch.json //new launch.json

your old launch.json


{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Launch Extension",
            "type": "extensionHost",
            "request": "launch",
            "runtimeExecutable": "${execPath}",
            "args": [
                "--extensionDevelopmentPath=${workspaceRoot}"
            ],
            "stopOnEntry": false,
            "sourceMaps": true,
            "outDir": "${workspaceRoot}/out",
            "preLaunchTask": "npm"
        }
    ]
}

Now update your launch.json as below
new launch.json
**// remember please mention your main.js path into it**

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Launch",
            "type": "node",
            "request": "launch",
            "program": "${workspaceRoot}/app/main.js", // put your main.js path
            "stopOnEntry": false,
            "args": [],
            "cwd": "${workspaceRoot}",
            "preLaunchTask": null,
            "runtimeExecutable": null,
            "runtimeArgs": [
                "--nolazy"
            ],
            "env": {
                "NODE_ENV": "development"
            },
            "console": "internalConsole",
            "sourceMaps": false,
            "outDir": null
        },
        {
            "name": "Attach",
            "type": "node",
            "request": "attach",
            "port": 5858,
            "address": "localhost",
            "restart": false,
            "sourceMaps": false,
            "outDir": null,
            "localRoot": "${workspaceRoot}",
            "remoteRoot": null
        },
        {
            "name": "Attach to Process",
            "type": "node",
            "request": "attach",
            "processId": "${command.PickProcess}",
            "port": 5858,
            "sourceMaps": false,
            "outDir": null
        }
    ]
}

Now it debug is working, show notification popup for step by step debugging

Contributors

Topic Id: 7139

Example Ids: 23922

This site is not affiliated with any of the contributors.