平常在做網頁開發相關工作的大家有沒有想過一個問題 —
如何在VScode嵌入瀏覽器呢?
每次調整CSS後視窗都要在Browser和VScode切來切去的(如果是單螢幕)，切一次1秒那一年會花掉多少時間呢?
今天我想分享一個套件解決這個問題，提升DX(Developer Experience)!
Browse Lite 由Vue團隊核心成員Anthony Fu等開發者製作的套件，以下Demo執行畫面:
要達到上面Demo的步驟:
- VScode先安裝 Live Server
- VScode安裝 Browse Lite
- 開啟網頁伺服器 ex: http://127.0.0.1:5501/demo.html 將網址複製
(編輯html檔案時，右鍵Open with Live Server) - 在VScode 按下F1呼叫指令面板 輸入Browse Lite: Open 並執行，這樣就開啟內建瀏覽器了!
- 貼上複製的網址! 右上角蟲子icon可以呼叫檢查(如上面demo)
6. 最後調整完頁面可以用Lock固定住分頁，之後就是愉快地開發~
目前用起來缺點就是解析度比較低，不過這是小問題，當功能完成後再到真正的瀏覽器測試就好了。
以上分享，希望對大家有幫助~
#瀏覽器嵌入VScode
#
