教育行業(yè)A股IPO第一股(股票代碼 003032)

全國咨詢/投訴熱線:400-618-4000

前端通過Chrome Workspace調(diào)試本地項目

更新時間:2018年01月05日13時54分 來源:傳智播客 瀏覽次數(shù):

通過 Workspace,你可以把本地服務(wù)器的資源映射為硬盤上的文件,實現(xiàn)調(diào)試 JS 和 CSS 的同時自動保存文件,比如 Elements 面板中的樣式變更會自動保存到文件中。

打開 DevTools 開發(fā)者工具中的 Sources 面板,在面板左側(cè)右鍵選擇「Add folder to workspace」,選擇添加的文件夾:

添加文件夾到 workspace

添加好后,右鍵一個文件,選擇「Map to file system resource...」,在彈出的文本框中選擇在 Workspace 中對應(yīng)的文件:

添加映射文件
選擇對應(yīng)的本地文件

比如我映射了 style.min.css 文件,那么現(xiàn)在你編輯元素面板中的樣式,Chrome 就會實時保存本地的文件變更。

具體的文件映射規(guī)則可以到 Devtools > Settings > Workspace 中設(shè)置:



本文版權(quán)歸傳智播客前端與移動開發(fā)學(xué)院所有,歡迎轉(zhuǎn)載,轉(zhuǎn)載請注明作者出處。謝謝!
作者:傳智播客前端與移動開發(fā)培訓(xùn)學(xué)院
首發(fā):http://metathetuscanyresort.com/web/

0 分享到:
和我們在線交談!