WebStorm中如何调试Vue项目

目录

  • 一、方法一
    • 1.设置调试端口
    • 2.配置参数
    • 3.启动服务
    • 4.调试
  • 二、方法二


一、方法一

1.设置调试端口

打开菜单 “File” -> “Setting…”,选中 “Build,Execution,Deployment”,可以看到 Port,默认的 Port 端口为 63342。
WebStorm中如何调试Vue项目_第1张图片

2.配置参数

WebStorm中如何调试Vue项目_第2张图片

3.启动服务

npm run dev

WebStorm中如何调试Vue项目_第3张图片

4.调试

点击调试按钮:
在这里插入图片描述
此时会跳出 404 错误页面:
WebStorm中如何调试Vue项目_第4张图片
将地址栏的地址修改正确即可进行调试:
在这里插入图片描述

二、方法二

在要调试得文件中加入:

debugger

console.log()

你可能感兴趣的:(前端深入浅出,webstorm,ide)