webstorm如何调试vue项目的js

webstormvuewebstorm调试jsjs

1.编辑调试配置，新建JavaScript调试配置，并设置要访问的url地址，如下图所示:



在URL处填写示例: http://localhost:8080

保存好调试配置

2.先用dev正常启动项目，然后切换到刚才设置的js调试名称，点击debug按钮，这时候会打开chrome，如下图所示 :



4.当我们在chrome中运行页面，WebStorm就会响应断点状态，如下图所示:

webstorm如何调试vue项目的js的更多相关文章

  1. 基于vue项目的js工具方法汇总

    以下是个人过去一年在vue项目的开发过程中经常会用到的一些公共方法,在此进行汇总,方便以后及有需要的朋友查看~ let util = {}; /** * @description 日期格式化 * @p ...

  2. WebStorm+Chrome调试Vue步骤

    在调试时请 注意 : 在WebStorm中启动调试时,WebStorm会根据你设置的url,自动打开新的Chrome浏览器进程访问这个设置的url,而且这个浏览器页面和你平常看到的浏览器差异会比较大, ...

  3. VueJs(15)--- Webstorm+Chrome 调试Vue项目

    Webstorm+Chrome 调试Vue项目 前言 在项目开发中,Debug模式是非常有必要的,后端对于IDEA工具而言Debug模式非常方便,但前端WebStorm而言如果启用Debug模式是需要 ...

  4. vue 项目的I18n国际化之路

    I18n (internationalization ) ---未完善 产品国际化是产品后期维护及推广中重要的一环,通过国际化操作使得产品能更好适应不同语言和地区的需求 国际化重点:1. 语言语言本地 ...

  5. 基于Vue cli生成的Vue项目的webpack4升级

    前面的话 本文将详细介绍从webpack3到webpack4的升级过程 概述 相比于webpack3,webpack4可以零配置运行,打包速度比之前提高了90%,可以直接到ES6的代码进行无用代码剔除 ...

  6. vue项目的mode:history模式

    最近做的Vue + Vue-Router + Webpack +minitUI项目碰到的问题,在此记录一下,Vue-router 中有hash模式和history模式,vue的路由默认是hash模式, ...

  7. 56.关于vue项目的seo问题

    不可否定的是,vue现在火.但是在实际项目中,特别是像一下交互网站,我们不可避免会考虑到的是seo问题,这直接关系到我们网站的排名,很多人说用vue搭建的网站不能做优化,那我们真的要放弃vue,放弃前 ...

  8. Vue项目的npm环境搭建

    Vue项目的环境搭建主要步骤如下: vue项目创建 安装NodeJS +到官网下载自己系统对应的版本,这里我们下载Windows系统的64位zip文件,下载完成后解压,可以看到里面有一个node.ex ...

  9. vue项目的webpack4.X配置

    这两天摆弄webpack,躺过很多坑,直到今天看了一位博主的文章才得以解决.他对配置中的各个部分做说明. 下面的配置99.9%抄自博主: https://www.cnblogs.com/nianyif ...

随机推荐

  1. 图像Resize中0.5像素中心对齐的问题

    目录 0.5像素对齐的问题 0.5像素对齐的问题 1. 问题提出 在进行图像缩放时,偶尔会看到一些比较奇怪的代码,其中有一个就是0.5像素中心对齐的问题,例如在OpenCV线性插值的代码中有类似如下操 ...

  2. SpringBoot（三）手写starter pom自动配置

    思想:主要是EnableAutoConfiguration在启动的时候会扫描spring.factories并加载 1在resource下面新建META-INF/spring.factories 2在 ...

  3. hadoop在eclipse当中如何添加源码？

    [学习笔记] /*org.apache.hadoop.mapreduce.Mapper.Context,java.lang.InterruptedException,想看map的源代码,按contro ...

  4. PS复制图层快捷键

    选中图层,按“Ctrl + J”即可快速复制图层.

  5. springcloud超简单的入门3--负载均衡

    上个文章的末尾说到,当有多个服务实例的时候,怎样来获取服务实例.但是,只是简单的通过get(0)来获取列表中的第一个实例来使用. 现实场景中,还需要写一个算法来实现负载均衡来决定每次使用的服务实例,而 ...

  6. python学习-26 函数作用域

    举例说明: 1. name = 'john' def foo(): name = 'xiaomming' def bar(): print(name) return bar a=foo() print ...

  7. Linux (x86) Exploit 开发系列教程之二(整数溢出)

    (1)漏洞代码 //vuln.c #include <stdio.h> #include <string.h> #include <stdlib.h> void s ...

  8. Python【BeautifulSoup解析和提取网页数据】

    [解析数据] 使用浏览器上网,浏览器会把服务器返回来的HTML源代码翻译为我们能看懂的样子 在爬虫中,也要使用能读懂html的工具,才能提取到想要的数据 [提取数据]是指把我们需要的数据从众多数据中挑 ...

  9. 基于laravel框架构建最小内容管理系统

    校园失物招领平台开发 --基于laravel框架构建最小内容管理系统 摘要 ​ 针对目前大学校园人口密度大.人群活动频繁.师生学习生活等物品容易遗失的基本现状,在分析传统失物招领过程中的工作效率低下. ...

  10. k8s-部署策略

    在Kubernetes中有几种不同的方式发布应用,所以为了让应用在升级期间依然平稳提供服务,选择一个正确的发布策略就非常重要了. 选择正确的部署策略是要依赖于我们的业务需求的,下面我们列出了一些可能会 ...