<sub id="wmxdm"></sub>

  • <strike id="wmxdm"><pre id="wmxdm"><s id="wmxdm"></s></pre></strike>
      <sub id="wmxdm"><address id="wmxdm"><div id="wmxdm"></div></address></sub>

    1. <strike id="wmxdm"><pre id="wmxdm"><s id="wmxdm"></s></pre></strike>
      你的位置:首頁 > IT資訊 > 行業新聞

      微軟發布VS Code新擴展 面向Web開發人員調試DOM

      更新:2019-07-15 17:36:00      點擊:
      • 品牌型號   
      • 市 場 價      元
      • 優 惠 價      元
      • 產品描述微軟發布VS Code新擴展 面向Web開發人員調試DOM
      產品介紹

      微軟項目經理 Paul Gildea  發博說,他們針對 Web 開發人員,發布了一個新的 VS Code 擴展—— Elements for Microsoft Edge,這個擴展還是一個預覽版,目的是讓開發者更好地在瀏覽器工具和編輯器中操作和調試 HTML 和 CSS 的問題。

      訪問:

      微軟中國官方商城 - Visual Studio

      對 Web 開發人員來說,當在 DevTools 和 IDE 之間中完成相同的任務時,不同的工作流混在一起會覺得很不方便,所以 Paul Gildea 提出三方面改進:

      • 在 DevTools 中修改 CSS 時,快速將更改更新到源代碼

      • 在 DevTools 中對 HTML/CSS 進行多次修改時,降低丟失更改的可能性

      • 快速對源代碼進行更改,并在瀏覽器中看到該更改

      Elements for VS Code 擴展就是簡化工作流的第一步,從 VS Code 中直接檢查和調試 DOM,并實時查看更改對頁面的影響。

      如果想要安裝 Elements for Microsoft Edge 擴展,首先安裝 Microsoft Edge 的 Dev 或 Canary 版本,然后從 VS Code 市場安裝 Elements for Microsoft Edge VS Code 擴展,兩個安裝完畢后,在 VS Code 中打開工作項目,之后會在側欄看到一個新的圖標:

      單擊這個圖標將會進入目標列表,該列表將顯示 Microsoft Edge 的任何可調試實例。如果當前沒有可調試的實例,則可以單擊 + 按鈕啟動新實例并將其附加到其中?;蛘?,可以在 Launch.json 文件中使用任務,就像使用其他類型的調試器擴展一樣。

      添加瀏覽器實例將打開新元素工具面板,顯示站點或應用程序的 HTML 文檔結構和 CSS 樣式信息,如下圖,如果經常使用 Microsoft Edge DevTools 或其他 Chromium 驅動的瀏覽器工具,應該熟悉這個視圖。

      要在元素擴展中查看網站的實時視圖,只需按下“Toggle Screencast”按鈕即可,這個視圖將在對 CSS 和 HTML 進行更改時實時更新,因此不必離開 VS Code 來查看更改情況。

      Paul Gildea 還表示不打算將 Microsoft Edge DevTools 從瀏覽器中完全遷移到 IDE 中。

      查看示例或反饋問題地址:

      https://github.com/microsoft/vscode-edge-devtools

      更多產品
      關閉
      日本系列第一页_玖草福利视频_无毛白虎_先锋影音一区二区