學習前端開發這么久了，在調試頁面的時候會經常用到一些開發工具，個人喜歡用firebug。但今天小熊個人博客為大家說到的是Chrome里面的開發工具Workspace。

Workspace是？

Workspace允許開發著在Chrome調試工具中實時編輯源文件。系統會將磁盤文件匹配到你的本地服務器上，這樣你可以通過Chrome的source panel保存修改的代碼，或者當外部文件更新時立即刷新。這樣就能夠避免開發人員在工具中調試好，再到編輯器中修改一次代碼的重復操作，提高編輯效率。

Workspace你會用嗎？

如果想要更多的了解Workspac開發工具，那么就請查看:《開發者調試工具Chrome Workspace》

在這里就簡單為大家介紹一些操作方法。

1. 打開開發者工具（F12），點擊右下角的設置按鈕。

?

?

2. 選擇 Workspace, 然后選擇 Add folder。

?

?

3.選擇源文件所在文件夾，當彈出提示時，選擇允許。

?

?

4.在Chrome的Source面板右鍵選擇需要編輯的源文件，選擇“Map to a Network Resource”。

?

?

這樣在Chrome的調試工具里面編輯該源文件，或者直接修改css樣式（對于css文件），再用Ctrl+S保存，這樣修改的代碼就自動保存到本地文件中了。

?

Chrome 30的Workspace已經支持了SASS、LESS等CSS預處理器，后面馬上會支持Stylus和Compass。

新人創作打卡挑戰賽發博客就能抽獎！定制產品紅包拿不停！

總結

以上是生活随笔為你收集整理的Chrome Workspace开发者调试工具的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。