Gỡ lỗi Ionic 2 trong Visual Studio Code - Cách nhấn điểm ngắt trong tệp nguồn?

Question

Vấn đề: Breakpoints chỉ bị trúng trong nối tập tin build www \ build \ js \ app.bundle.js

Tái sản xuất

1. tôi bắt đầu giả lập, chạy ứng dụng trên trình mô phỏng (công cụ này hoạt động hoàn hảo)

2. Đặt một số điểm ngắt trong tệp thư mục ứng dụng, ví dụ: app/pages/list/list.js

3. Trong mã VS> Ngăn gỡ lỗi, tôi chọn Attach to running Android on Emulator. Trình gỡ lỗi chạy và kết nối.

Kết quả thực tế

3. Các breakpoint không trúng trong các tập tin nguồn gốc. Họ chỉ có được hit nếu tôi đặt chúng trong js tập tin build www\build\js\app.bundle.js

Lưu ý về Sourcemaps

Trong MyIonic2Project\.vscode\launch.json, các cài đặt cho các Đính kèm để chạy trên cấu hình Emulator là:

"sourceMaps": true, 
"cwd": "${workspaceRoot}", 
"ionicLiveReload": false 

---

Thiết lập của tôi

Nó một dự án Ionic 2, được tạo ra sử dụng:

ionic start --v2 -a "My Ionic 2" MyIonic2Project tutorial 

này hoạt động hoàn hảo với các lệnh cli: trên Chrome với ionic serve, giả lập sử dụng ionic emulate android, và trên thiết bị cũng như (HTC One M8), vì vậy tất cả là tốt lên đến :-) điểm này

tôi đã cài đặt mới nhất Visual Studio Mã, và bao gồm các công cụ Cordova: ext install cordova-tools

Answer 1

tôi có thông tin thêm, nhưng quá lâu để đưa vào bình luận, vì vậy đưa vào như câu trả lời . Cung cấp phản hồi nếu cần cập nhật.

Từ diễn đàn Ionic 2, sau đây là liên kết đến hướng dẫn gỡ lỗi trực tiếp trong tệp VSCode TypeScript.

Sử dụng phần mở rộng Ionic CLI, cho ngắn gọn. Cũng cần trình gỡ lỗi cho phần mở rộng của Chrome cho VSCode.

Debugging Ionic 2 Apps trong Chrome từ Visual Studio Mã http://www.damirscorner.com/blog/posts/20161122-DebuggingIonic2AppsInChromeFromVisualStudioCode.html

Cập nhật: Xem @Kinorsi comment để biết chi tiết về việc này để làm việc cho điện thoại di động

Có một vấn đề có liên quan trên GitHub - đã được Closed, có thể đáng chú ý. Độ phân giải là hệ thống xây dựng Ionic 2 RC không còn sử dụng gulp nữa. Ngoài ra, cũng có thêm nhận xét về việc sử dụng nội tuyến sourcemaps "ionic_source_map_type": "#inline-source-map": TypeScript source files cannot be debugged on a real mobile device in Android #22