Visual Studio Code调试Angular
环境:
- nodejs
- @angular/cli
- visual studio code
步骤:
1、创建Angular项目;
ng new ClinetApp
cd ClientApp
code . # 使用Visual Studio Code打开文件夹
2、安装调试插件【Debugger for Chrome】或者【Debugger for Microsoft Edge】;
3、按【Ctrl + Shift + ~】打开TERMINAL,输入ng serve运行Angular项目;
4、按【Ctrl + Shift + D】打开Run窗口,点击【create a launch.json file】创建运行配置文件;
5、点击【Add Configuration...】按钮添加配置,选择【Chrome: Launch】项创建Chrome运行配置;
6、修改启动url为【http://localhost:4200】;
7、然后点击如图的按钮,或者按【F5】启动浏览器,即可进行调试。
注:
如若项目为Asp.Net Core + Angular,则需要运行配置【launch.json】中的【webRoot】,将其修改为Angular项目的根目录,否则是无法命中断点的。