可通过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 1514 Free Candies 解题报告

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1514 题目意思:有4堆糖果,每堆糖果有n个,从上到下排好,取糖果只能从上往下取,取完的糖果放在篮子里, ...

  2. I.MX6 Parallel RGB LCD Datasheet描述

    /******************************************************************** * I.MX6 Parallel RGB LCD Datas ...

  3. CodeForces242D:Connected Components (不错的并查集)

    We already know of the large corporation where Polycarpus works as a system administrator. The compu ...

  4. Watir: Watir webdriver对JS 弹出框的操作现在非常简单。

    以下代码支持Firefox,IE,Chrome require 'watir-webdriver' #require "watir-webdriver/extensions/alerts&q ...

  5. bzoj4557 [JLoi2016]侦察守卫——DP

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=4557 见这位的博客:https://www.cnblogs.com/Narh/p/91403 ...

  6. 高并发服务器架构--SEDA架构分析

    纯粹转发,没有深入研究,转自:SEDA架构笔记 百牛信息技术bainiu.ltd整理发布于博客园  一.传统并发模型的缺点 基于线程的并发 特点:每任务一线程直线式的编程使用资源昂高,context切 ...

  7. VMware Workstation安装centos 6.5详细步骤

    转自“http://blog.51cto.com/12496630/2058386” 22.选择分区了,centos新版中使用lvm来分区,我不用过分去计算分区大小,这个模式可以允许用户以后动态调整分 ...

  8. Mac下的常用终端命令与vim常用命令

    因为很少用命令行,老被鄙视,所以今天记录一下常用的命令行: cd 切换工作目录 . 表示当前目录 .. 表示当前目录的上一级目录 / 根目录/目录分隔符 ./ 当前目录 ../ 回到上一级目录 ls ...

  9. poj2421【MST-prim+Kruskal】

    水过~~~~打好基础/~~ ------prim #include <iostream> #include <stdio.h> #include <string.h> ...

  10. python __builtins__ set类 (60)

    60.'set',  转换为集合类型 class set(object) | set() -> new empty set object | set(iterable) -> new se ...