webStrom断点调试

最近HTML5很火,而且大家都在用webStrom开发工具,但是有个问题是我们写javaScript怎么像其他编辑器那样进行断点调试呢,今天军哥就带大家来配置一下,让你的webStrom如同飞一般的感觉

• 1.断点调试需要浏览器添加支持的插件,以Chrome浏览器为例,如果怕麻烦的同学可以直接点击下面的连接为Chrome添加插件
  https://chrome.google.com/webstore/detail/hmhgeddbohgjknpmjagkdomcpobmllji

ps:需要翻墙哦

• 2.如果你记不住的话,直接看图

  
  
  更多工具 -->扩展程序

• 3.点击获取更多扩展程序

  
  
  这个样子
• 4.搜索JetBrains IDE Support
  
  JetBrains IDE Support

• 5.然后添加

  
  
  点击添加即可
• 6.接下来在你的Chrmoe的右上角就能看到一个 JB了
  
  右键点击选项

• 7.然后配置 配置完成之后要点击 Apply

  
  
  直接看图吧,配置完成之后要点击 Apply
• 8.接下来设置默认浏览器为Chrome这一步很关键,因为调试的浏览器只会启动默认浏览器
• 9.开始调试
  打开webStrom,创建一份工程,写javaScript代码

注意这里调试的只是javaScript

• 10.点击断点,在js代码前面点击,当代码执行的时候就会在这里停下,下面的代码就不执行了

  
  
  像这样

• 11.然后在这个工程的HTML文件上右键

  
  
  右键运行

• 12.接下来你就会看到断点调试后的界面

  
  
  断点调试的界面
  
  
  如图

持续更新实用的干货
微博关注 coderYJ
简书关注 coderYJ