始终坚信阅读和调试结合的方式,才是学习开源的高效方法 一.老版本调试 遥想当年的threejs(使用版本为r75)还没有CommonJS,对于我这个小白可以拿起大刀大杀四方......(咳.咳. 就是拿来简单画个方块啥的...),使用vscode简单配置一下就可以老老实实的拜倒在我的淫威之下.这种小秘籍已经遍地都是,说出来也不怕大家偷学去. 1 准备 vscode + debugger for chrome 2 设置 打开html所在目录后,F5开始调试,选择chrome调试器 生成launch

原文地址:http://www.noanylove.com/2011/12/node-the-inspector-debugging-node-js/ 用node-inspector调试Node.js   2011年12月15日 | 标签: JavaScript, Node.js, 调试   重要:因为node和node-inspector更新了的缘故,现在的界面有一些不同,抽空我会更新一下.另外,下面的debug参数前应该是两个“-”,不知道为什么显示出来只有一个“-”.比较郁闷. 据说,一个

前两天拉取公司前端代码修改,发现在开发者工具的sources选项里边,居然没有列出来我要调试的js脚本,后来观察了一下,脚本是动态在页面里引入的,可能是因为这样所以不显示出来,但是如果不能断点调试,只靠打印日志真要把人累死了,效率太低,网络搜索试验了一下,有两种方式可以解决: 1.在脚本里边增加 //# sourceURL=xxxxxxxxx.js,名称自己命名,可以直接使用文件名,如下图: 然后在网页里打开包含这个js的页面,这样就在开发者工具里能够看到了,可以像普通js一样正常打断点并进行调

在开发的过程中,几乎不可能一次性就能写出毫无破绽的程序,断点调试代码是一个普遍的需求. 作为前端开发工程师,以往我们开发的JavaScript程序都运行在浏览器端,利用Chrome提供的开发者工具就可以方便的进行源码断点调试.其步骤有四,详情不表,粗略概括如下: 打开Chrome开发者工具: 点击进入Sources标签页,在页面的左侧就能看到JS代码的目录: 找到需要设置断点的源文件,在需要中断的哪行代码左侧单击鼠标左键,就可以设置断点,如果你的代码是uglify过的,则需导入相应的source

一.背景 使用Visual Studio Code写了一个简单的Html页面,想调试下其中script标签里的javascript代码,网上查了一通,基本都是复制粘贴或者大同小异的文章,就是要安装Debugger for Chrome插件,修改launch.json配置信息,F5启动,这些都照做了,但是仍有两个问题,一个是Html文件里不能打断点,只能在js文件里面打,二是chrome打开后说连接不到localhost,下面分别讲讲是怎么解决. 二.Html文件中不能打断点问题 默认情况下,VS

vsCode 添加浏览器调试和js调试的方法 1.直接按F5可以调试的方法或者点击运行按钮(可以直接运行html文件或者js文件) 在launch.json文件中的配置如下: {     "version": "0.2.0",     "configurations": [{             "name": "谷歌浏览器", //运行html文件,用谷歌浏览器打开             "

Good News: 现在我们可以用浏览器调试node.js了!!! 前提 Node.js 6.3+, 这个可上Node.js官网自行下载: Chrome 55+. 如果您本地的chrome升级到最新版后还是<55, 可以从此处下载:Chrome Canary,亲测可行. 配置 就目前来说,在浏览器端并行调试JavaScript与Node.js还属于新特性,新体验.为了能够正常使用,你还需要做如下配置: 输入url:chrome://flags/#enable-devtools-experime

1.断点调试是啥?难不难? 断点调试其实并不是多么复杂的一件事,简单的理解无外呼就是打开浏览器,打开sources找到js文件,在行号上点一下罢了.操作起来似乎很简单,其实很多人纠结的是,是在哪里打断点?(我们先看一个断点截图,以chrome浏览器的断点为例) 步骤记住没? 用chrome浏览器打开页面 → 按f12打开开发者工具 → 打开Sources → 打开你要调试的js代码文件 → 在行号上单击一下,OK!恭喜你的处女断点打上了,哈哈~~ 火狐浏览器: 2.断点怎么打才合适? 打断点操作

安装node相关 从node官网下载node的安装文件,我下的版本是node-v0.10.22-x64.exe,安装完node,node相关工具应该都加都环境变量path中了. 命令行下安装node-inspector(调试器) npm -g install node-inspector 安装完后,就可以按照node-inspector的github主页上进行调试了,但步骤比较麻烦,用sublime简化步骤. 安装sublime2 从sublime官网下载并安装sublime2(不安装3的bet

调试 node.js 程序 在程序开发中,如何快速的查找定位问题是一项非常重要的基本功.在实际开发过程中,或多或少都会遇到程序出现问题导致无法正常运行的情况,因此,调试代码就变成了一项无法避免的工作.这里简单介绍下如何调试 node.js 程序. 使用 console.log Node 提供了全局的 console 对象,该对象可以输出格式化的字符串. console.log 是调试 Node 模块最简单的工具,console.log 主要有两个作用:一是将对象序列化为一个字符串,另一个是向标准

因要做一个B/S架构的项目,使用MVC框架技术,本人不擅长页面设计美工,只好用bootstrap框架,在chrome内核系列的浏览器和IE 11中显示都没有问题,但是在 IE 8下显示却不正常,表格无法显示.找了很多资料.在页头加了<meta http-equiv="X-UA-Compatible" content="IE=edge">这句话,没表格的显示正常了,有表格的还是显示不正常,提示有错误,用开发者模式,但看到的js文件那么几行长长的,不好下断点

1.直接按F5可以调试的方法或者点击运行按钮(可以直接运行html文件或者js文件) 在launch.json文件中的配置如下: {     "version": "0.2.0",     "configurations": [{             "name": "谷歌浏览器", //运行html文件,用谷歌浏览器打开             "type": "chro

效果里面的函数, 如show, hide,slideDown等, 这些都叫 "效果"函数, 但是里面可以包含动画, 也可以 不包含动画. 动画,是指 元素 的内容 是 逐渐 显示/隐藏的, 不是一下子就 出来的. 如果函数中的参数 speed 或 spe, 不写, (speed的默认值等于0) 就是 "直接效果, 原始效果", 没有 动画的 版本; 如果指定了参数 spe, 就是有动画的版本, 两者都是 " 效果 " 函数 效果函数中的 spee

原文链接 : Debugging Node.js in Chrome DevTools 原文作者 : MATT DESLAURIERS 译文出自 : 掘金翻译计划 译文链接 : https://github.com/sqrthree/sqrthree.github.io/issues/8 译者 : sqrthree (根号三) 校对者: shenxn.CoderBOBO 这篇文章介绍了一种在 Chrome 开发者工具里面开发.调试和分析 Node.js 应用程序的新方法. devtool 最近我

大部分基于 Node.js 的应用都是执行在浏览器中的, 比如强大的调试工具 node-inspector. node-inspector 是一个全然基于 Node.js 的开源在线调试工具,提供了强大的调试功能和友好 的用户界面,它的用法十分简便. 首先,使用 npm install -g node-inspector 命令安装 node-inspector,然后在终 端中通过 node --debug-brk=5858 debug.js 命令连接你要除错的脚本的调试server, 启动 no

环境: Visual Studio Code  Node.js 1. 关闭运行中的程序 2.打开入口文件,我这里的入口文件为 app.js 3.点击左侧菜单栏的 debug 按钮 4.点击运行按钮 5.打开控制台,把这里往上拉 选择调试控制台 6.在需要断点的地方打上红点 7.运行程序 我们可以看到黄色的地方就是我们打的断点,我们可以在最上面的这里调试程序 也可以使用快捷键 F10.F11 进行调试 把光标覆盖到变量上可以查看当前时刻变量的值 我们可以再左侧栏处查看调试相关的东西 在断点处,我们

1 解决的问题 1)        场景1:生产环境报错 对前台开发来说,业务逻辑都在js中,所以报错90%以上都是js问题. 如果生产环境出现报错,但是测试环境正常.这时修改了代码没有环境验证效果,直接升级到生产环境风险又太高--(1)万一升级后依然不好使导致客户不耐烦呢?(2)万一牵连出别的问题呢? 此时需要一种方法,可以在生产环境的网址上调试本地的js文件. 2)        场景2:本地工程不给力 某个任务修改了js文件,进行单元测试时发现本地工程太慢,或者本地工程更新了代码后项目无法

如果你在编写Node.js代码,node-inspector是必备之选,比Node.js的内置调试器好出许多.使用起来跟Chrome的javascript调试器很相似. 使用npm安装: $ npm install -g node-inspector 然后需要通过浏览器连接到node-inspector,需要启动inspector服务: $ node-inspector 然后要在新的控制台以debug模式运行node.js应用: $ node --debug app.js 通过URL http:

1.全局安装 node-inspector  cnpm install -g node-inspector 2.启动node项目入口文件,如 node --inspect index.js 3.控制台将出现如下地址字样,将后面的路径放到chrome中打开. Debugger listening on ws://{host}:{port}/8483d157-1020-49ac-b537-4 4.在chrome中看到如下页面,右键检查,调试页面就出来了,再点击图中的红圈图标,出来最终的调试界面,这时

1.服务启动IP及端口,如果是云服务,IP选用服务器内网IP.同时需要防火墙需要添加端口. #添加端口 $ firewall-cmd --zone=public --add-port=9229/tcp --permanent // (permanent是保存配置,不然下次重启以后这次修改无效) #重启防火墙: $ firewall-cmd --reload #调试方式启动nodejs项目$ node --inspect=内网IP:9229 bin/www 2.在Webstorm项目窗口中,打开R

VS Code相关插件:Chinese (Simplified) Language Pack for Visual Studio Code Debugger for Chrome ESLint Vetur   一 安装:安装VS Code插件  Debugger for Chrome 二 配置:config下index.js cacheBusting  由  true 改为 false//cacheBusting: true,   cacheBusting:false, devtool 由 ch