在IDEA中Debug调试VUE项目的详细步骤
更新时间：2021年10月15日 11:45:06 作者：就是不掉头发
idea竟然有一个神功能很多朋友都不是特别清楚，下面小编给大家带来了在IDEA中Debug调试VUE项目的详细步骤，感兴趣的朋友一起看看吧
调试js代码，每次都在要在代码中写debugger，或者在chrome中打断点，而且chrome的断点信息不人性化。偶然发现idea竟然有这个功能，简直神器啊。研究了半天终于搞定了，哈哈，开心。下面是详细步骤：
1.下载浏览器插件
在chrome应用商店搜索"jetbrains ide support"插件，可能需要FQ（不会百度，老D google host），如下图，这里是我安装好的。这里我试过找下载好的插件，安装但是没有连接成功，总是提示错误，下文会提到。所以别偷懒，老老实实下载。
安装成功后如右上角会出现此图标
需要注意的是，不要找下载好的插件安装，一是安装后不起作用，二是chrome不信任未知来源的插件，重启后会自动停用插件。如果不能在线安装的话，还有一个办法：将下载后的插件后缀名改为rar，解压缩到文件夹里，使用浏览器的插件开发者模式，将文件夹加载为插件，也可安装。
还有在插件图标上右键，选项，如下图，可以配置端口，这里要和idea里的一致才行；
2.配置IDEA
idea中配置如下
这两步配置好以后，运行刚创建的JavaScript Debug 就可以debug启动，打断点访问了
到此这篇关于在IDEA中Debug调试VUE前端项目的方法的文章就介绍到这了,更多相关idea调试vue项目内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了vue 使用lodash实现对象数组深拷贝操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-09-09
Element-UI组件el-table用于展示多条结构类似的数据,可对数据进行排序、筛选、对比或其他自定义操作,本文给大家介绍Element-UI实现复杂table表格结构的操作代码,感兴趣的朋友一起看看吧2023-12-12
这篇文章主要为大家详细介绍了vue实现文件上传和下载，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-08-08
在许多应用程序中，我们经常需要执行定期的异步任务轮询，本文就介绍了Vue3如何处理异步任务轮询，感兴趣的可以了解一下2023-05-05
本篇文章主要介绍了vue-cli开发环境实现跨域请求的方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-04-04
这篇文章主要介绍了vue中使用axios固定url请求前缀的实现方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-12-12
全局安装 Vue cli3 和 继续使用 Vue-cli2.x操作
这篇文章主要介绍了全局安装 Vue cli3 和 继续使用 Vue-cli2.x操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-09-09
vue 跳转页面$router.resolve和$router.push案例详解
这篇文章主要介绍了vue 跳转页面$router.resolve和$router.push案例详解,这样实现了既跳转了新页面,又不会让后端检测到页面链接不安全之类的,需要的朋友可以参考下2023-10-10
moment.js是一款现在对时间处理的强大的函数，这篇文章主要介绍了Vue 日期获取的示例代码，代码简单易懂，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2023-01-01
这篇文章主要为大家介绍了前端axios取消请求总结示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-10-10
最新评论