目录
2. Chrome安装插件JetBrains IDE Support
1. WebStorm调试官方视频:
WebStorm官方视频:https://www.jetbrains.com/webstorm/documentation/
百度网盘:https://pan.baidu.com/s/1DeCrEk0c3tAjesaNHSlQ1w
参考:Debugging JavaScript in Chrome
2. Chrome安装插件JetBrains IDE Support
安装最新版本的需要翻墙,
在Chrome输入:https://chrome.google.com/webstore/detail/hmhgeddbohgjknpmjagkdomcpobmllji
2.0.9_0版本百度网盘:https://pan.baidu.com/s/1bluDbiU6Dj8m4COIVc9leg
打包Chrome插件参考:Chrome插件打包成crx文件
3. 设置ip地址和端口号
3.1 查看WebStorm的Debugger端口
File -> Setting -> Build,Execution,Deployment -> Debugger,端口号默认:63342
3.2 设置JetBrains IDE Support
1. Chrome地址栏直接输入:chrome://extensions/找到JetBrains IDE Support 查看详情;
2. 点击“扩展程序选项”
3. 设置ip和port
4. WebStorm测试debug
4.1 创建一个index.html
在项目创建index.html,js添加断点;
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>WebStorm js测试</title>
<script>
var num, num2, total;
function addNum() {
num = 12;
num2 = 32;
total = num + num2;
alert(total)
}
</script>
</head>
<body>
<button onclick="addNum()">测试</button>
</body>
</html>
4.2 js调试
1. index.html右键“Debug ‘index.html’”
2. 弹出:Chrome浏览器
3. 点击“测试”按钮
开始测试:
可以点击页面上面的,查看WebStorm的Debugger;
也可以直接在WebStorm进行调试
今天的文章webstorm配置javascript项目_nodejs调试分享到此就结束了,感谢您的阅读。
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
如需转载请保留出处:http://bianchenghao.cn/77468.html