当前位置: 开发笔记 > 编程语言 > 正文

phpstorm,webstormdebug调试JS

作者：水瓶座爱狮子 | 来源：互联网 | 2023-08-15 17:09

第一步：给你的Chr

第一步：给你的`Chrome`添加`JetBrains IDE Support`的插件，需要FQ，就是下图的这个。

`添加一个Javascript Debug`

`name可以自定义，URL根据自己实际情况，(我这边没有在下面的Before launch:Show this page,Activate tool window这一栏里添加这个项目npm start或者yarn start的启动脚本，一定要先启动项目，然后在点虫子按钮)`

需要设置的话，配置如下，具体命令和package.json根据实际情况配置

浏览器的配置，点击后就后开启监控

点小虫虫开始debug，谷歌浏览器会弹出一个独立的浏览器页面用于调试

重点来了，有时候你在编辑器的代码可能断点不了，可以用console.log()打印，然后在浏览器点进源码进行断点，触发时会自动联动到编辑器

推荐阅读

js
Node.js学习笔记(一)package.json及cnpm

本文介绍了Node.js中包的概念，以及如何使用包来统一管理具有相互依赖关系的模块。同时还介绍了NPM（Node Package Manager）的基本介绍和使用方法，以及如何通过NPM下载第三方模块。 ... [详细]

蜡笔小新 2023-12-10 18:26:02
js
JavaScript进化：从迁徙到TypeScript

本文介绍了JavaScript进化到TypeScript的历史和背景，解释了TypeScript相对于JavaScript的优势和特点。作者分享了自己对TypeScript的观察和认识，并提到了在项目开发中使用TypeScript的好处。最后，作者表示对TypeScript进行尝试和探索的态度。 ... [详细]

蜡笔小新 2023-12-09 19:52:20
js
微信民众号商城/小顺序商城开源项目介绍及使用教程

本文介绍了一个基于WeiPHP5.0开发的微信民众号商城/小顺序商城的开源项目，包括前端和后端的目录结构，以及所使用的技术栈。同时提供了项目的运行和打包方法，并分享了一些调试和开发经验。最后还附上了在线预览和GitHub商城源码的链接，以及加入前端交流QQ群的方式。 ... [详细]

蜡笔小新 2023-12-09 08:45:47
js
React 小白初入门

推荐学习：React官方文档：https:react.docschina.orgReact菜鸟教程：https:www.runoob.c ... [详细]

蜡笔小新 2023-10-17 16:10:45
js
快速学习RN之环境搭建和跑demo(一)

RN即ReactNative基于React框架针对移动端的跨平台框架,在学习RN前建议最好熟悉下html,css,js,当然如果比较急,那就直接上手吧,毕竟用学习前面基础的时间,R ... [详细]

蜡笔小新 2023-10-17 15:29:16
js
技术周报 · 20210507

技术周报·2021-05-07-小编推荐向现代Javascript转型原文标题：Publish,ship,andinstallmodernJavaScriptforfaste ... [详细]

蜡笔小新 2023-10-16 17:21:04
js
idea激活服务器 3月最新注册码

idea激活服务器3月最新注册码，https:www.yht7.comidea。详细ieda激活码不妨到云海天教程 ... [详细]

蜡笔小新 2023-10-13 11:18:19
js
Vue3 拥抱 TypeScript 的完整项目结构搭建

大厂技术高级前端Node进阶点击上方程序员成长指北，关注公众号回复1，加入高级Node交流群一个完整的Vue3Ts项目,支持.vue和.tsx写法项目地 ... [详细]

蜡笔小新 2023-10-13 06:53:19
js
代码在jsfiddle.net可以运行，在浏览器上没反应

下面的代码在jsfiddle.net上可以运行，在chrome和Firefox上没反应?IDE是WebStorme代码一直出错，放到jsfiddle.net上却可以，弄到有点怀疑 ... [详细]

蜡笔小新 2023-10-12 18:18:27
js
C#生成随机数的三种方法及其问题分析

本文介绍了C#中生成随机数的三种方法，并分析了其中存在的问题。首先介绍了使用Random类生成随机数的默认方法，但在高并发情况下可能会出现重复的情况。接着通过循环生成了一系列随机数，进一步突显了这个问题。文章指出，随机数生成在任何编程语言中都是必备的功能，但Random类生成的随机数并不可靠。最后，提出了需要寻找其他可靠的随机数生成方法的建议。 ... [详细]

蜡笔小新 2023-12-14 14:15:30
js
webpack二刷之二、loader资源模块加载器

loader资源模块加载器webpack资源模块加载webpack内部(内部loader)默认只会处理javascript文件，也就是说它会把打包过程中所有遇到的 ... [详细]

蜡笔小新 2023-10-17 21:26:42
js
1 Vue基础

Vue基础一、什么是Vue1.1概念Vue(读音vjuː，类似于view)是一套用于构建用户界面的渐进式JavaScript框架，与其它大型框架不 ... [详细]

蜡笔小新 2023-10-17 19:45:53
js
【珍藏】2019年最新Vue相干佳构开源项目库汇总

媒介本文的前身是源自github上的项目awesome-github-vue,但由于该项目上次更新时候为2017年6月12日，许多内容早已逾期或是许多近期优异组件未被收录，所以小肆 ... [详细]

蜡笔小新 2023-10-17 14:33:46
js
Node.js开发札记之二·页面篇

前言：原本纠结于Web模板，选了Handlebars。后来发现页面都是弱逻辑的，不支持复杂逻辑表达式。几乎要放弃之际，想起了Javascript中ev ... [详细]

蜡笔小新 2023-10-16 23:59:51
select
Vuecli前端工程配置

全局安装Vue-cli工具在任意目录打开任意命令行终端(cmd，powershell，vscode内置等)npminstall-gvuecli#O ... [详细]

蜡笔小新 2023-10-13 11:35:46

phpstorm,webstormdebug调试JS

第一步：给你的Chrome添加JetBrains IDE Support的插件，需要FQ，就是下图的这个。

添加一个Javascript Debug

name可以自定义，URL根据自己实际情况，(我这边没有在下面的Before launch:Show this page,Activate tool window这一栏里添加这个项目npm start或者yarn start的启动脚本，一定要先启动项目，然后在点虫子按钮)

需要设置的话，配置如下，具体命令和package.json根据实际情况配置

浏览器的配置，点击后就后开启监控

点小虫虫开始debug，谷歌浏览器会弹出一个独立的浏览器页面用于调试

重点来了，有时候你在编辑器的代码可能断点不了，可以用console.log()打印，然后在浏览器点进源码进行断点，触发时会自动联动到编辑器

第一步：给你的`Chrome`添加`JetBrains IDE Support`的插件，需要FQ，就是下图的这个。

`添加一个Javascript Debug`

`name可以自定义，URL根据自己实际情况，(我这边没有在下面的Before launch:Show this page,Activate tool window这一栏里添加这个项目npm start或者yarn start的启动脚本，一定要先启动项目，然后在点虫子按钮)`