可通过workspaces来编辑本地文件

workspaces是Chrome DevTools的一个强大功能，这使DevTools变成了一个真正的IDE。Workspaces会将Sources选项卡中的文件和本地项目中的文件进行匹配，所以你可以直接编辑和保存，而不必复制/粘贴外部改变的文件到编辑器。

为了配置Workspaces，只需打开Sources选项，然后右击左边面板的任何一个地方，选择Add Folder To Worskpace，或者只是把你的整个工程文件夹拖放入Developer Tool。现在，无论在哪一个文件夹，被选中的文件夹，包括其子目录和所有文件都可以被编辑。为了让Workspaces更高效，你可以将页面中用到的文件映射到相应的文件夹，允许在线编辑和简单的保存。

选择响应的代码目录添加后，google会有一个弹出框，点击允许，即可实现再调试模式下编辑代码自动同步本地文件

其他一些chrome开发技巧可参考：

https://www.cnblogs.com/luoruiyuan/p/6479007.html

chrome调试之Workspaces的更多相关文章

  1. Chrome调试手机页面

    新开发的网页需要在手机或是模拟机上运行测试,如果手头事件比加紧,那么可以借助 Chrome提供的手机网页预览程序进行简单调试.查看 制作的网页是否能够适合各种手机型号使用. 下面所以下如何使用Chro ...

  2. Chrome调试中的奇技淫巧

    网上有关Chrome调试的文章一搜一大堆,本文主要记录一下自己平时经常用并且又比较冷门的一些技巧. 打开Chrome调试工具 1.打开控制台的情况下,长按页面的“刷新”按钮可以选择按何种方式刷新(有正 ...

  3. VS Code - Debugger for Chrome调试JavaScript的两种方式

    VS Code - Debugger for Chrome调试JavaScript的两种方式 最近由于出差的缘故,博客写的不是很多,一直想写一篇VS Code - Debugger for Chrom ...

  4. chrome 调试 SASS

    第一步: 执行sass预编译命令 先来我的项目文件夹结构: ->进入sass /css文件下->打开cmd命令 ->输入sass --watch --scss  test.scss: ...

  5. chrome调试

    今天对chrome调试又进行了系统的学习. Chrome调试工具developer tool技巧 把以前没有使用过的功能列举一遍. 伪类样式调试:伪类样式一般不显示出来,比如像调试元素hover的样式 ...

  6. chrome调试hove等类似事件

    前台开发过程中经常会用chrome调试代码.但是有的时候,hover或者js控制的属性显示不全 解决办法有两种: 1.根据chrome版本不一样(检查两个字)可能会有所差别 2.图中有标记

  7. chrome调试本地项目, 引用本地javascript文件

    chrome调试本地项目, 引用本地javascript文件 本地文件可以访问本地文件 修改快捷方式属性 C:\Users\xxx\AppData\Local\Google\Chrome\Applic ...

  8. 利用chrome调试JavaScript代码

    看见网上很多人问怎么用chrome调试JavaScript代码,我也对这个问题抱着疑问,但是没有找到一篇能用的中文文章(可能我的google有问题),也不知道怎么点出一篇E文的,感觉作者写得不错,所以 ...

  9. Chrome 调试动态加载的js

    今天有个同事问到我用chrome调试动态加载js的问题,这个问题之前遇到过,只是时间有点长了,有些忘记.在这里做一下记录: 在要调试的源码的后面加上 //@ sourceURL= debug.js 注 ...

随机推荐

  1. hdu 4300 Clairewd’s message（kmp/扩展kmp）

    题意:真难懂.. 给出26个英文字母的加密表,明文中的'a'会转为加密表中的第一个字母,'b'转为第二个,...依次类推. 然后第二行是一个字符串(str1),形式是密文+明文,其中密文一定完整,而明 ...

  2. 【Codeforces 664A】 Complicated GCD

    [题目链接] 点击打开链接 [算法] gcd(a,a+1) = 1 所以当a = b时,答案为a,否则为1 [代码] #include<bits/stdc++.h> using names ...

  3. UVA 11174 Stand in a Line 树上计数

    UVA 11174 考虑每个人(t)的所有子女,在全排列中,t可以和他的任意子女交换位置构成新的排列,所以全排列n!/所有人的子女数连乘   即是答案 当然由于有MOD 要求逆. #include & ...

  4. 字体的设置 REM EM PX

    px 1 一般设置页面的字体使用px 2 优点:字体设置比较稳定和精确 3 缺点:他会修改用户浏览器中的字体大小 EM 相对于父元素的字体大小,字体大小不确定,容易混乱,“em”是相对于其父元素来设置 ...

  5. 【WIP】MVVM

    创建: 2018/04/05 懒得写了

  6. PTA【复数相乘】

    队友在比赛时A掉的.吊吊吊!!! 主要考虑这些情况吧||| 案例: /* 3i i -3 i -1-i 1+i i 1 -1-i -1-i */ -3 -3i -2i i 2i #include &l ...

  7. 11.6NOIP模拟赛

    [数据规模和限制] 对于全部测试数据,满足 N,M,K≤,W≤ 各个测试点的数据规模及特殊性质如下表. 测试点 N M K ≤ ≤ ≤ ≤ ≤ ≤ ≤ ≤ ≤ ≤ 师 更多咨询:北京信息学窦老师 QQ ...

  8. keepalived 原理、安装与使用

    1. keepalived工作原理 keepalived是集群管理中保证集群高可用的一个服务软件,其功能类似于heartbeat,用来防止单点故障. keepalived是以VRRP协议为实现基础的, ...

  9. IT兄弟连 JavaWeb教程 请求重定向案例

    Check2Servlet类与Output2Servlet类之间为请求转发关系.在web.xml文件中,为Check2Servlet映射的URL为"/check2",为Output ...

  10. 第五篇 .NET高级技术之CTS、CLS、CLR

    CTS.CLS.CLR 1. .Net平台下不只有C#语言,还有VB.Net.F#等语言.IL是程序最终编译的可以执行的二进制代码(托管代码),不同的语言最终都编译成标准的IL(中间语言,MSIL): ...