码迷,mamicode.com
首页 > 其他好文 > 详细

开发人员调试工具Chrome Workspace

时间:2017-05-23 20:35:26      阅读:172      评论:0      收藏:0      [点我收藏+]

标签:port   initial   war   hub   warning   work   调试   提示   文件夹   

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

配置Chrome Workspace功能

Chrome Workspace功能是将在Chrome开发人员工具(F12)中对文档的改动直接应用于相应文件里。


因为Chrome并不知道当然文档相应用的文件为哪个,所以须要配置Workspace的映射关系来告诉Chrome对哪个文件做改动

使用Workspace条件:

  • Chrome V31+(正式版)
  • 本地server开发

1.点击F12工具的设置button

技术分享

2.点击左側的workspace

技术分享

3.点击Add folder

技术分享


4.选择server所在的根文件夹,之后确定会chrome会在上面做出一个提示,点击同意技术分享5.

双击下图所看到的的地方,配置映射关系技术分享

6.填写映射关系,视详细情况填写,注意右边的/一定要填写(关键性步骤)技术分享

然后点击空白处。完毕填写


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

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


參考:

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

开发人员调试工具Chrome Workspace

标签:port   initial   war   hub   warning   work   调试   提示   文件夹   

原文地址:http://www.cnblogs.com/lytwajue/p/6895741.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!