開發的時候，經常會有測試某些函式、程式碼範例的需求，這時候雖然可以用 JSFiddle, Go Playground 等服務進行測試，不過最方便的還是能在編輯器中直接執行測試。
這個需求可以用 VS Code 擴充 — Code Runner 解決！
該擴充支援執行多種程式語言的程式碼片段(Code Snippets)或者程式碼檔案，包含 C, C++, Java, JavaScript, Python, Go, Rust 等程式語言，相當適合執行某些程式碼範例、測試函式庫的使用方式等情況。
Posted on Jan 31, 2024 in VS Code , VS Code 擴充推薦 by Amo Chen ‐ 2 min read
你是否對於經常打 console.log() 感到厭煩？是不是想擺脫這種枯燥乏味的 console.log() 人生？
試試 Turbo Console Log 吧！
Posted on Jan 16, 2024 in VS Code , VS Code 擴充推薦 by Amo Chen ‐ 2 min read
如果工作上經常需要跟 XML 格式的資料或設定檔打交道的話，推薦可以在 VS Code 安裝由 Red Hat 開發的 XML 擴充。
Posted on Sep 1, 2023 in VS Code , VS Code 擴充推薦 by Amo Chen ‐ 1 min read
Sass 的出現，改善 CSS 語法的不足， Sass 可以更像寫程式一樣定義變數、函數，也可以使用 if-else, for 等程式常見的邏輯控制，甚至模組化都可以做到，最後還可以編譯輸出 CSS, 讓前端工程師的工作效率提升到一個全新檔次。
知名的前端框架 Bootstrap 即使用 Sass 開發的，足見 Sass 的實用性！
本文將如何在 VS Code 中使用 Live Sass Compiler 擴充將 Sass 編譯成 CSS 。
Posted on Aug 26, 2023 in VS Code , VS Code 擴充推薦 by Amo Chen ‐ 2 min read
Material Icon Theme 是 VS Code 擴充中著名的 VS Code 主題，擁有 4.9 顆星的評價， 1,900+ 萬個安裝數，是我個人正在使用的主題，也推薦給大家。
本文將介紹如何安裝與設定 Material Icon Theme 。
Posted on Aug 26, 2023 in VS Code , VS Code 擴充推薦 by Amo Chen ‐ 2 min read
個人以往長時間使用 Vim 作為主要編輯器使用，但是現在除了 Vim 之外，也會使用 VS Code 進行開發。
Vim 有個功能稱為 bookmark , 可以讓人在特定行做一個書籤，等到需要的時候，可以使用快捷鍵/指令迅速跳到該書籤，可以節省切換的時間，相當高效。
不過使用 VS Code 之後就失去這個功能，所幸還是可以安裝擴充解決問題。
這個擴充稱為 Numbered Bookmarks 推薦給大家使用。
Posted on Aug 25, 2023 in VS Code , VS Code 擴充推薦 by Amo Chen ‐ 2 min read
開發 JavaScript, TypeScript 相關的專案都經常會碰到檔案總管(explorer)會顯示 dist/ , build/ , node_modules/ 等資料夾，這些資料夾的存在會為搜尋或是 Command Palette 的搜尋結果帶來影響，總是顯示太多不需要的檔案而造成困擾。
所幸這個可以在 VS Code 中設定排除。
每個開發者或開發團隊在開發時，或多或少都會在註解(comments)留下一些說明或標籤(tags)，包含 TODO , FIXME , WARNING , REF 等等，這些被稱為 Codetags 。
雖然目前還沒有明確標準要怎麼使用這些標籤，不過開發時如果能將這些標籤強調(highlight)顯示，讓開發者更容易注意到註解處有其他成員想要說明的事或想要做的事，讓註解不僅僅只是註解，而是增加註解被關注到的機率。
本文將介紹 VS Code 擴充 Better Comments, 讓開發者或開發團隊可以自訂要強調顯示的 codetags, 以增強開發協作能力。
Posted on Aug 14, 2023 in VS Code , VS Code 擴充推薦 by Amo Chen ‐ 2 min read