专栏首页smy开发者调试工具Chrome Workspace

开发者调试工具Chrome Workspace

Workspace是个什么样的东西呢?他能够在开发者工具中调试修改js或者css同时自动保存文件,能够避免开发人员在工具中调试好,再到编辑器中修改一次代码的重复操作,能够提高一定的效率

配置Chrome Workspace功能

Chrome Workspace功能是将在Chrome开发者工具(F12)中对文档的修改直接应用于对应文件中。 由于Chrome并不知道当然文档对应用的文件为哪个,所以需要配置Workspace的映射关系来告诉Chrome对哪个文件做修改 使用Workspace条件:

  • Chrome V31+(正式版)
  • 本地服务器开发

1.点击F12工具的设置按钮

2.点击左侧的workspace

3.点击Add folder

4.选择服务器所在的根目录,之后确定会chrome会在上面做出一个提示,点击允许

5.

双击下图所示的地方,配置映射关系

6.填写映射关系,视具体情况填写,注意右边的/一定要填写(关键性步骤)

然后点击空白处,完成填写

7.然后回到一个页面中去,试着去更改一个样式数值,然后打开你的样式文件,验证是否生效

注意Workspace只对外部引入的CSS样式有效!

参考:

http://www.cnblogs.com/terrylin/p/3629751.html

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Eslint检测出的问题如何自动修复

    1. sublime 插件 eslintAutoFix 目前只试了windows下 真是大坑!如果你用了这个插件但不能自动修复,那就不要再用这个了!全网无解! ...

    smy
  • git将代码提交到远程分支(非主分支)

    一个仓库可以包含多个分支,有一个默认的主分支:master 若想提交代码至远程仓库的某个分支(非主分支) 先查看下本地分支以及远程分支:git branch -...

    smy
  • 前后端分离之vue2.0+webpack2 实战项目 -- html模板拼接

    对于前后端分离,如何把一个页面的公共部分比如head, header, footer, content等组合成一个完整的html 是一个值得考虑的地方。 对于p...

    smy
  • 百度资深架构师谈:如何设计一个百万级用户的抽奖系统?

    抽奖、抢红包、秒杀,这类系统其实都有一些共同的特点,那就是在某个时间点会瞬间涌入大量的人来点击系统,给系统造成瞬间高于平时百倍、千倍甚至几十万倍的流量压力。

    用户5546570
  • Python 爬虫进阶篇-4行代码实现爬取指定网站中的全部图片,深入剖析

    上一篇:Python 爬虫入门篇-如何获取网页中的图片。我们了解到了urllib获取图片的原理,urllib.request.urlretrieve()就是用来...

    小蓝枣
  • 通过BGP EV**方式动态建立VXLAN隧道实现

    如下图的组网图所示,Router1为企业分支网关,Router2为企业总部网关,由于分支与总部之间用户的业务需求不同,则将其规划为不同网段。企业分支的PC_1与...

    刘銮奕
  • Android检查网络状态工具类详解

    在Android中开发具有网络交互的应用时候,有时候我们需要检查网络状态才能确定是否去请求网络,就需要用到公共类

    砸漏
  • python操作文本文件

    mwangblog
  • 【谷歌官方文档】1.1 建立第一个APP

    本小节介绍如何使用Android Studio或者是SDK Tools中的命令行来创建一个新的项目。

    吴延宝
  • 腾讯云公网宽带如何收费?

    腾讯云的公网宽带计费方式有四种,即包年包月(元/Mbps/月)、按量计费(元/Mbps/小时)、按量计费(元/GB)和共享带宽包(元/Mbps),不同计费方式下...

    用户2416682

扫码关注云+社区

领取腾讯云代金券