在react中经常开发碰到不能热更中进行调试的，如IE之类的

这个时候我们就需要打包才能运行看到效果，

但是往往每次打包都需要很长的时间；

这个时候我们就可以直接找到打包后的文件，直接在改文件中修改；

但由于该文件是压缩过的，只有一行，无法阅读，所以可以通过chrome的sources,找到JS文件，在点击{}进行美化，再替换到本地的打包后的文件，即可进行断点等调试，这样可以实时保存看到效果，而不用再每次修改一点就打包等半天在看效果

当碰到需要调试打包后的js的更多相关文章

  1. 配置webpack中externals来减少打包后vendor.js的体积

    在日常的项目开发中,我们会用到各种第三方库来提高效率,但随之带来的问题就是打包后的vendor.js体积过大,导致加载时空白页时间过长,给用户的体验太差.为此我们需要减少vendor.js的体积,从本 ...

  2. 前端工具-调试压缩后的JS（Source Map的使用）

    使用 Source Map 可以在 FF 的调试器. Chrome 的 Sources 和 VSCode 中给压缩前的文件下断点,也可以方便定位错误发生的位置(定位到压缩前的文件). 何为 Sourc ...

  3. vue+webpack+element-ui项目打包优化速度与app.js、vendor.js打包后文件过大

    从开通博客到现在也没写什么东西,最近几天一直在研究vue+webpack+element-ui项目打包速度优化,想把这几天的成果记录下来,可能对前端牛人来说我这技术比较菜,但还是希望给有需要的朋友提供 ...

  4. 简要分析webpack打包后代码

    开门见山 1.打包单一模块 webpack.config.js module.exports = { entry:"./chunk1.js", output: { path: __ ...

  5. webpack入门之打包html,css,js,img(一)

    webpack到底是什么,网上一大堆介绍的东西,越看越不知道说的什么,所以今天打算自己来记录一下这段时间学习webpack的成果, webpack就是打包文件用的,html,css,js,img,为什 ...

  6. Vue打包后放到服务器出现Loading chunk {n} failed 错误

    导航栏点击切换时 会出现Loading chunk {n} failed  ,刷新之后便不会出现.而且n在最新的build的文件中,n没有存在 偶然一次发现,项目更新迭代开发时上传测试环境后就会出现, ...

  7. WebPack打包后如何调试

    作为一个程序员每天的大部分工作就是调试自己写的程序,那我们使用了webpack后,所以代码都打包到了一起,给调试带来了麻烦,但是webpack已经为我们充分考虑好了这点,它支持生产Source Map ...

  8. (16/24) webpack打包后的调试方法

    在程序开发中,调试程序是最频繁的,那使用了webpack后,所有的代码都打包到了一起,这给调试带来了困难,但是webpack在设计时就已经考虑好了这点,它支持生产Source Maps来方便我们的调试 ...

  9. webpack快速入门——打包后如何调试

    在配置devtool时,webpack给我们提供了四种选项. source-map:在一个单独文件中产生一个完整且功能完全的文件.这个文件具有最好的source map,但是它会减慢打包速度: che ...

随机推荐

  1. 《JAVA与模式》之模板方法模式

    在阎宏博士的<JAVA与模式>一书中开头是这样描述模板方法(Template Method)模式的: 模板方法模式是类的行为模式.准备一个抽象类,将部分逻辑以具体方法以及具体构造函数的形式 ...

  2. Fiddler工具详细介绍

    百度看到Fiddler工具的详细介绍,转载收藏,侵权删,原文地址:http://blog.csdn.net/qq_21445563/article/details/51017605 前部分讲解Fidd ...

  3. 析构方法 deinit

    /* 析构方法: 对象的内存被回收前被隐式调用的方法, 对应OC的dealloc方法 主要执行一些额外操作, 例如释放一些持有资源, 关闭文件, 断开网络等 */ class FileHandle { ...

  4. redis集群配置及运行命令(windows和centos)附Python测试范例代码

    表示配置主服务器器的IP和端口 slaveof <masterip> <masterport> # 设置slave是否是只读的.从2.6版起,slave默认是只读的. slav ...

  5. （转）mysql explain详解

    原文:http://www.cnblogs.com/xuanzhi201111/p/4175635.html http://yutonger.com/18.html http://www.jiansh ...

  6. IDEA里运行程序时出现Error：scalac：error while loading JUnit4 , Scala signature JUnit4 has wrong version错误的解决办法（图文详解）

    不多说,直接上干货! 问题详情 当我们在运行程序时,出现Error:scalac:error while loading JUnit4 , Scala signature JUnit4 has wro ...

  7. docker 容器启动后立马退出的解决方法

    原因: 容器同时只能管理一个进程,如果这个进程结束了容器就退出了,但是不表示容器只能运行一个进程(其他进程可在后台运行),但是要使容器不退出必须要有一个进程在前台执行.   解决方案: 启动脚本最后一 ...

  8. elasticsearch插件安装之--中文分词器 ik 安装

    /** * 系统环境: vm12 下的centos 7.2 * 当前安装版本: elasticsearch-2.4.0.tar.gz */ ElasticSearch中内置了许多分词器, standa ...

  9. 数据序列化导读(2)[YAML]

    上一节讲了JSON, 这一节将介绍YAML.可以认为,YAML是JSON的超集,但是更加简单易用,适合人类阅读和书写. 1.  什么是YAML? YAML是YAML Ain't Markup Lang ...

  10. php里的二进制安全

    二进制安全功能(binary-safe function)是指在一个二进制文件上所执行的不更改文件内容的功能或者操作.这能够保证文件不会因为某些操作而遭到损坏.二进制数据是按照一串0和 1的形式编码的 ...