广东36选7走势图表:Workspace:chrome浏览器开发者工具

2013-06-06 09:50:01  来源:网页教学网 

广东36选7怎么中 www.t5a2.cn

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

13

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

之前这样的功能需要在本地开启一个sever端的服务。例如 autosave(https://github.com/NV/chrome-devtools-autosave),每次需要开启nodejs的sever端才能使用。

目前Chrome的正式版已经集成了这个功能,就方便了开发者许多,如何使用呢?

(如果你是使用Canary或者Chromiumde,Workspace已经不再是实验选项,跳过1,2项)

1.在 chrome://flags/ 中启用 Developer Tools Experiments (开发者工具实验)

2.在 Developer tools 设置 Experiments 选项下开启File system folders in Sources Panel,再重启Developer tools,就会多出Workspace选项。

File-system-folders-in-Sources-Panel

3.Chrome为了确保安全,将目录添加到File systems时会要求在目录中存在.allow-devtools-edit文件,才允许开发者工具添加目录编辑保存文件,所以需要在资源目录中创建这个名字的空文件,方式有很多,例如:在资源目录中执行命令

Windows copy con .allow-devtools-edit 再 Ctrl + Z

cmd

Mac touch .allow-devtools-edit

4.在Workspace中把你的资源目录添加到File systems即可,如果CSS,JS链的是URL可以使用Mappings来设置路由(注意:结尾千万不要加上\,他逻辑只判断了是否以/结尾,否则就会变成path\/,略坑啊~~)

workspace

现在就可以在开发者工具中各种调试了,你就可以看到你的源文件也跟着改动啦~。

dev-edit

或者也可以在Sources中修改文件

sources

缺陷

无论是 autosave 还是 workspace 比较遗憾都不能支持SCSS,LESS的编辑
总之Workspace还是能在调试阶段帮助我们提升效率

更多
  • Conférence de presse du Premier ministre chinois 2019-04-18
  • 回复@海之宁:你敢从逻辑入手批判咱的帖子么? 2019-04-18
  • 您访问的页面找不回来了 2019-04-06
  • 国学与社会主义核心价值观专题 2019-03-30
  • 世界3D打印技术产业 大会会址永久落户佛山 2019-03-26
  • 星光熠熠的戛纳 红毯之外这座小城还有哪些看头 2019-03-22
  • 文艺名家话“精神故乡”系列访谈 2019-03-22
  • 神奇!沈阳现3D稻田画 2019-03-16
  • 【理上网来·辉煌十九大】比尔盖茨:中国减贫经验值得世界借鉴 2019-03-13
  • 3000多只股票,0.6%涨停,咱们聊聊这4只 2019-03-10
  • 人民网评:从青年习近平身上汲取榜样力量 2019-03-03
  • 玉竹斑斑,【端午节】快乐![放鞭炮][大笑] 2019-02-27
  • 上海合作组织青岛峰会举行 2019-02-27
  • 刘延东:把孔子学院办成中南人民心灵的“彩虹桥” 2019-02-04
  • 《习近平新闻思想讲义(2018年版)》出版发行 2019-01-25
  • 224| 139| 376| 187| 224| 425| 448| 475| 483| 233|