How to debug Javascript in webstorm when gulp is serving the application

流过昼夜 提交于 2019-12-14 00:46:29

问题


In Webstorm, I am running gulp serve task that launches localhost:9000 stub angular project generated with yo. I am trying to debug JavaScript code and this is what i have tried:

  • I run gulp as a debug task, I can only debug gulp file lines
  • I try to run gulp serve before JavaScript, it starts serving and Webstorm never gets to launching its JavaScript debug session
  • I try to run JavaScript debug, I don't get breakpoints inside my code.

What is the workflow in this situation?

PS. i am not trying to debug code inside chrome developer tools, i want my breakpoints to work in Webstorm


回答1:


In your Javascript - put debugger; between two of your lines, and pop open your Developer Tools in Chrome. When you refresh the page - if your script runs, it should stop where you put the debugger; and you'll be able to hover on different variables to see their values. Very powerful and basic tool.

Also, if you don't want to have the script stop - you can console.log(variable); to have the Developer Tools console print out the variable.

Example:

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

Don't forget to remove the debugger; when you're done. I recommend using jshint in your gulp to make sure you don't miss those kinds of things.



来源:https://stackoverflow.com/questions/34313401/how-to-debug-javascript-in-webstorm-when-gulp-is-serving-the-application

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!