WebPack+WebStorm调试

怎么用webstorm来调试WebPack？

今天查了很多文档，最终在官网上耐心看完英文文档后，才解决。附上链接：https://blog.jetbrains.com/webstorm/2015/09/debugging-webpack-applications-in-webstorm/

工具简介

Windows7

WebStorm2017

Webpack2

谷歌浏览器（默认浏览器）

操作

  • 在Project视图里找到index.html，右击进入Debug模式

  • WebStrom会自动进入Debug模式，浏览器自动打开index.html，此时右下角提示

  • （可能需FQ）点击并下载JetBrains IDE Support，安装之后浏览器右上角有个图标，此时只要你在JS代码上打了断点的，会自动跳至对应断点

然后右击调试index.html文件，此时浏览器会自动打开页面，并提示正在调试！

时间： 2024-10-12 04:50:58

WebPack+WebStorm调试的相关文章

使用webstorm调试Hexo

之前在编辑hexo下的插件的时候,就觉得用notepad++有点麻烦,需要确认的都要打印出来,因此考虑使用用惯了的编辑器WebStorm,但是会者不难,难者不会,牵扯到hexo命令,确实有点挠头,查找了半天,还绕了一个弯才最终解决. 如何做 说麻烦麻烦,说简单其实也很简单,就是需要做了一个配置而已. 我使用的环境是WebStorm,其他版本应该类似: Run-->Edit Configurations... 如上图,选好Node的位置,设定好工作目录.稍微有点不一样的是,启动文件选择node_m

windows下webstorm调试react native

安装请参考:http://www.cnblogs.com/wjx0912/p/5662457.html webstorm在2016.10.20的版本才正式增加react native的调试支持,所以webstorm一定要更新到最新版本 https://blog.jetbrains.com/webstorm/2016/10/webstorm-2016-3-eap-163-6512/ https://blog.jetbrains.com/webstorm/2016/11/webstorm-2016-

使用WebStorm调试node工程

coder比较偏好debug,调试node比较麻烦,我们借助高大上的工具webStorm(我用的是10)来调试node,配置也比较简单,直接上图: 首先,配置node环境,在导航栏选择"Edit/configuration", 接下来配置 注:javascript file 为node的入口 到这里还没有结束,还需要配置远程调试,在上面的窗口中,选择defaults中的 node.js remote debug: 下面就可以debug了,入口在这里:

使用webstorm调试node程序

前言 相信大家接触过不少node代码了,如果你应用的比较初级或者针对你的项目不需要接触过深的node代码,也许你仅仅需要简单的console.log('your variable')就完全满足你的需要了.如果你应用node比较深入,想要调试(debug)之,我想你应该接触过node-inspector,大致用法流程,简单如下—— 1.安装:npm install -g node-inspector 2.启动debug模式(单独命令行): node-debug &(该命令默认8080端口) nod

关于webstorm调试默认浏览器修改

作为初学者,大家在使用webstorm软件的时候, 有可能会遇到调试的时候浏览器打不开,  或者想要自定义调试浏览器的时候,  找不到怎么设置,  我也是在网上找了好久,  都没有找到方法,   后来还是自己弄明白了,  这里给和我一样的小白们分享下,见下图

React+Webpack+Webstorm开发环境搭建

需要安装的软件 node.js npm包管理 Webstorm 由于6.3.0版本之后会自带npm的包管理所以不需要单独的安装npm nodejs(包含npm)安装在默认路径C:\Program Files\nodejs比较好,也不是很大 Webstrom安装完成后,在打开的 License Activation 窗口中选择 License server. 在输入框输入网址:http://idea.iteblog.com/key.php 最后点击 Activate 构建项目和安装依赖包 使用we

Pomelo 运行原理及WebStorm调试

首先我们需要知道,NodeJS应用程序可以在运行命令中加入--debug=5858参数,可以使得NodeJS程序监听本地5858端口,并开启调试模式. pomelo的运行原理: pomelo start时,启动了master服务器,然后其先读取配置文件,再启动由game-server/config/servers.json文件中经过配置的各个服务器进程.其中,你看到的id.host.port等等都是子服务器的启动参数,这些参数都会放到启动命令行中app.js的后面. 的设计人员最初已经考虑到了直

webstorm调试Node的时候配置

点击Edit Configurations的这个的配置:(不能点击是因为目前你选中的不是项目)

webpack源码分析——配置调试环境

无论是阅读webpack源码,还是编写webpack的plugin和loader,配置调试环境都是很有必要的.weabpack的运行环境是nodejs,调试webpack就是调试nodejs程序.我们平时使用的IDE如eclipse.webstorm都支持nodejs的调试.本文以eclipse(Version: Oxygen.1a Release (4.7.1a))为例,进行讲解. 在这个例子里面,我们使用webpack <entry> [<entry>] <output&