Below you will find pages that utilize the taxonomy term “Visual Studio Code”
Posts
>-
使用 Visual Studio Code 撰寫 JavaScript,如果要加上 jsdoc comment,可以考慮為 Visual Studio Code 加裝 Add jsdoc comments 套件。
按下熱鍵 Ctrl-Shift-P / Cmd-Shift-P 開啟 command palette,輸入 Extensions:Install Extensions,輸入 Add jsdoc comments 找到擴充套件進行安裝。
安裝後重啟 Visual Studio Code。
在要加上 jsdoc comment 的程式碼上按下熱鍵 Ctrl-Shift-P / Cmd-Shift-P,或是透過滑鼠右鍵快顯選單開啟 command palette。
選取 Add Doc Comments。
jsdoc comment 即會被加到程式碼上,再視需要做些調整就可以了。
Link Add jsdoc comments - Visual Studio Marketplace
read morePosts
Visual Studio Code - Using .NET Core in Visual Studio Code
要用 Visual Studio Code 開發 .NET Core,需先安裝 .NET Core SDK。
然後安裝 Visual Studio Code 的 C# Extension。
C# Extension 安裝後進行重啟。
將 Visual Studio Code 切至專案目錄,透過 Terminal 視窗建立專案。
dotnet new [ProjectTemplate] 還原套件。
dotnet restore 運行結果。
dotnet run 若要除錯的話,需先建立 launch.json 檔。
將 program 位置設為專案輸出檔的位置,以筆者這邊的例子來說就是 “${workspaceRoot}/bin/BPC/Debug/netcoreapp1.1/Test.dll”。
再來建立 task.json 檔。
最後設斷點啟動除錯即可。
Link C# programming with Visual Studio Code .NET Core and Visual Studio Code Get started with C# and Visual Studio Code - C# Guide | Microsoft Docs
read morePosts
Visual Studio Code - Markdown preview
Visual Studio Code 要預覽 Markdown,可以按下熱鍵 Ctrl + Shift + P / Cmd + Shift + P 開啟 command palette,選取 Markdown:Open Preview。
或是使用熱鍵 Ctrl + Shift + V,即可切換至 Markdown 的預覽。
若是想要在預覽的同時做編輯,可以按下熱鍵 Ctrl + Shift + P / Cmd + Shift + P 開啟 command palette,選取 Markdown:Open Preview to the Side。
或是透過編輯區右上角的 Open Preview to the Side 按鈕。
抑或是按下熱鍵 Ctrl + K V / Cmd + K V,Markdown 預覽即會開在新的水平分割視窗,且在預覽畫面上滾動捲軸,編輯視窗的捲軸會跟著同步滾動。
read morePosts
vscode-icons - Icons for Visual Studio Code
vscode-icons 是 Visual Studio Code 的套件,能讓 Visual Studio Code 的 Explorer 對 Icon 的支援更好。
未安裝 vscode-icons 套件前 Visual Studio Code 的 Explorer 在檔案與目錄的顯示上缺少 Icon,檔案格式的識別或是目錄與檔案的識別都不容易。
按下熱鍵 Ctrl-Shift-P / Cmd-Shift-P 開啟 command palette,輸入 Extensions:Install Extensions,輸入 vscode-icons 找到 vscode-icons 擴充套件進行安裝。
安裝後重啟 Visual Studio Code。
重啟後啟用 vscode-icons 套件。
切到 Visual Studio Code 的 Explorer,即可看到 Visual Studio Code 的 Explorer 在檔案與目錄上都顯示了對應的 Icon。
Link vscode-icons - Visual Studio Marketplace File and Folder Icons in Visual Studio Code
read morePosts
vscode-hexo - VSCode extension to manage hexo commands
vscode-hexo 是 VSCode 的擴充套件,能讓我們在 VSCode 內簡易的調用 Hexo 命令。
按下熱鍵 Ctrl-Shift-P / Cmd-Shift-P 開啟 command palette,輸入 Extensions:Install Extensions,輸入 hexo 找到 vscode-hexo 擴充套件進行安裝。
安裝完後重啟 VSCode。
點選 [File | Open…] 將 Hexo 部落格目錄開啟。
按下熱鍵 Ctrl-Shift-P / Cmd-Shift-P,輸入 Hexo 即可看到可用的 Hexo 命令。
- hexo init # Initializes a website - hexo new # Creates a new article - hexo generate # Generates static files - hexo publish # Publishes a draft - hexo server # Starts a local server - hexo stop # stop a local server(Ctrl-C) - hexo deploy # Deploys your website - hexo clean # Cleans the cache file (db.
read morePosts
>-
在使用 Visual Studio Code 建置時如果看到 No build task defined. Mark a task with 'isBuildCommand' in the tasks.json file. 這樣的訊息,可能是因為 tasks.json 沒做設定導致。
可直接按下 Configure Build Task 按鈕。
選取 Task Runner。
調整 tasks.json 設定。
除了 tasks.json 沒設定外,還有個可能是因為 Visual Studio Code 沒載入設定導致,將 Visual Studio Code 重啟即可。
read morePosts
Visual Studio Code - Launch files in browser
要設定 Visual Studio Code 用瀏覽器開啟運行檔案,可開啟 Command palette (MAC 下使用 ‘CMD + Shift + P’,Windows 下使用 ‘Ctrl + Shift + P’) 選取 ‘Configure Task Runner’ 為專案加入 task.json。
MAC 下 task.json 可設定如下:
{ "version": "0.1.0", "command": "Chrome", "osx": { "command": "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" }, "args": ["${file}"] } Windows 下設定如下:
{ "version": "0.1.0", "command": "Chrome", "windows": { "command": "C:\Program Files (x86)\Google\Chrome\Application
read morePosts
Visual Studio Code - Analyze Python with Pylint
要在 Visual Studio Code 中開發 Python 並使用 Pylint 進行程式碼的分析,Visual Studio Code 要先安裝 Python 的套件,完成 Python 開發環境的設定。
然後安裝 Pylint,不同環境有不同的安裝方式,因為筆者用的是 Mac,所以是用 pip 安裝。
沒有 pip 的話要先進行安裝。
開啟 Visual Studio Code 運行 Python 程式,Visual Studio Code 偵測到 Pylint 沒安裝的話會彈出通知,並提供安裝的按鈕。
點選安裝的按鈕,安裝命令會帶到 TERMINAL 視窗調用。
如果有權限問題的話,還是需要自己調整命令後再調用。
安裝好後就可以支援 Python 的分析。
Link Pylint - code analysis for Python | www.pylint.org
read morePosts
Visual Studio Code - Debug with Visual Studio Code
要用 Visual Studio Code 進行程式碼的除錯,可透過 Visual Studio Code 左側的工具列切換至除錯畫面。
接著在程式碼欲中斷的程式碼位置前方用滑鼠點擊設置中斷點。
再按下 Debug 按鈕即可開始進行程式碼的除錯。
在程式碼進行除錯時,Visual Studio Code 會帶出變數資訊、呼叫堆疊、中斷點的控制設定及工具列等。
如有自己想要查看的變數,可按下滑鼠右鍵,選取 Debug: Add to Watch 選單選項。
變數即會被加入 WATCH 視窗,便於後續查看。
read morePosts
Visual Studio Code - Install extensions
要安裝 Visual Studio Cdoe 的外掛套件,可按下熱鍵打開 Command Palette (Windows 為 Ctrl+ Shift + P, OS X 為 CMD + SHIFT + P),搜尋並運行 Extensions:Install Extensions。
或是直接透過左邊的工具列按鈕開啟 Extensions:Install Extensions。
接著搜尋欲安裝的外掛套件後按下 Install 按鈕。
選取的外掛套件即會開始進行安裝。
安裝完後按下 Reload 按鈕讓安裝的外掛套件生效。
再次按下 Reload Window 按鈕確認 Reload 即可。
read morePosts
Visual Studio Code - Python on Visual Studio Code
要在 Visual Studio Code 使用 Python,可安裝 Visual Studio Code 的 Python 套件。
套件安裝完按下熱鍵打開 Command Palette (Windows 為 Ctrl+ Shift + P, OS X 為CMD + SHIFT + P),搜尋並運行 Tasks: Configure Task Runner。
接著選取 TypeScript - tsconfig.json。
修改 tasks.json 設定,command 設為 python、args 設為 ${file}、showOutput 設為 always。
設定修改完存檔,按下熱鍵運行 Tasks: Run Build Task (Windows 為 Ctrl+ Shift + B, OS X 為CMD + SHIFT + B),即可運行 Python 程式。
Link Python with Visual Studio Code [Python] 使用 Visual Studio Code 作為開發環境
read morePosts
Visual Studio Code - Check for updates
要更新 Visual Studio Code,可點選 [Code | Check For Updates…] 選單選項。
Visual Studio Code 會開始檢查是否有可用的更新。
然後開始安裝更新。
更新安裝後 Visual Studio Code 會出現提示 Visual Studio Code will be updated after it restarts.,告知我們可以套用更新,這邊可以按下 Update Now 按鈕立即套用更新,或是按下 Later 按鈕暫緩套用,抑或是按下 Release Notes 按鈕查閱這次的更新有什麼變更。
這邊按下 Update Now 按鈕繼續。
Visual Studio Code 重啟後更新就套用上去了。
read more