Làm thế nào để gỡ lỗi Javascript trong webstorm khi gulp đang phục vụ ứng dụng

Question

Trong Webstorm, tôi đang chạy nhiệm vụ phục vụ gulp khởi chạy localhost: 9000 stub project angular được tạo ra với yo. Tôi cố gắng để gỡ lỗi mã JavaScript và đây là những gì tôi đã cố gắng:

• tôi chạy ngụm như một nhiệm vụ gỡ lỗi, tôi chỉ có thể dòng tệp debug ngụm
• Tôi cố gắng chạy ngụm phục vụ trước JavaScript, nó bắt đầu phân phối và Webstorm sẽ không bao giờ khởi chạy phiên gỡ lỗi JavaScript của mình
• Tôi cố gắng chạy gỡ lỗi JavaScript, tôi không nhận được điểm ngắt bên trong mã của mình.

Quy trình làm việc trong tình huống này là gì?

PS. tôi không cố gắng gỡ lỗi mã bên trong công cụ nhà phát triển chrome, tôi muốn các điểm ngắt của tôi hoạt động trong Webstorm

Answer 1

Trong Javascript của bạn - đặt debugger; giữa hai dòng của bạn và mở Developer Tools trong Chrome. Khi bạn làm mới trang - nếu tập lệnh của bạn chạy, nó sẽ dừng ở nơi bạn đặt debugger; và bạn sẽ có thể di chuột qua các biến khác nhau để xem giá trị của chúng. Công cụ rất mạnh mẽ và cơ bản.

Ngoài ra, nếu bạn không muốn dừng tập lệnh - bạn có thể console.log(variable); để bảng điều khiển Công cụ dành cho nhà phát triển in ra biến.

Ví dụ:

var somethingOrOther = function(){ 
var blah = 'foo'; 
console.log(blah);// to print to console 
debugger; // to stop script at this point and look around 
}; 

Đừng quên để loại bỏ các debugger; khi bạn đã hoàn tất. Tôi khuyên bạn nên sử dụng jshint trong ngụm của bạn để đảm bảo bạn không bỏ lỡ những thứ đó.