如果您是開發人員或編碼人員，那麼您很可能一直在尋找新工具來幫助優化您的工作流程。 幸運的是，您可以找到的最佳代碼編輯器之一是 Mac 上的 Visual Studio Code。
Visual Studio Code（VS Code）提供了許多功能，可以幫助您更有效地編寫代碼。 在本文中，您將學習如何在 Mac 上安裝 VS Code，並通過一些最佳擴展和主題來開始使用。
繼續閱讀，準備提升您的工作流程吧！
先備知識
本教程將進行實踐演示。 如果您想跟著做，請確保您有一台 macOS 設備。 本教程使用的是蘋果矽（M1），因此如果您使用的是基於英特爾的 Mac，步驟可能略有不同。
下載 Visual Studio Code For Mac
Visual Studio Code（VS Code）是 Microsoft 提供的免費、開源的代碼編輯器，可用於 Windows、Linux 和 macOS。 但是，與其他工具一樣，您需要下載並安裝 VS Code 到您的系統中。
1. 打開您喜歡的網絡瀏覽器，轉到 VS Code 下載頁面。
2. 接下來，點擊 Mac 圖標下的 Apple Silicon，下載 VS Code 的 Mac 包安裝程序 ZIP 文件。 這個蘋果矽（M1）版本是蘋果最新開發的芯片。
如果您有一台帶有英特爾處理器的舊 Mac，請點擊 Intel Chip。
3. 最後，打開您的終端，執行以下ls命令，驗證您下載的VS Code套件安裝程序。
下面的輸出顯示了zip文件的位置。
在Mac上安裝Visual Studio Code
現在您已經下載了VS Code安裝程序，您可以在Mac上安裝VS Code，體驗重新定義的代碼編輯器。 VS Code經過優化，使您能夠更有效地構建和調試現代Web和雲應用程序。
VS Code的另一個強大功能是，通過在市場上找到的擴展，它支持大量編程語言。
在Mac上安裝VS Code：
1. 選擇下載的VS Code zip文件→點擊省略號圖標（右上角）→打開以解壓縮ZIP文件。
解壓縮後，您應該在Downloads文件夾中擁有一個新的Visual Studio Code應用程序。
2. 接下來，執行以下 ls 命令來驗證應用程式檔案。這個命令會列出 Visual Studio Code 應用程式檔案的內容。
反斜線符號是一個轉義字元，告訴終端將空格視為普通字符。當檔案名稱中有空格時，您必須使用轉義字元。
3. 執行以下 open 命令以在新實例（-n）中啟動安裝程式。
4. 現在，當您收到下面的提示時，點擊「開啟」繼續安裝。
此警告出現是因為您從互聯網下載了應用程式，您可以安全地忽略它。
安裝完成後，VS Code 應用程式將打開，並會跳出下面的「開始使用」頁面。
導航 VS Code 的 GUI
您已成功在 Mac 上安裝了 VS Code，但在開始編碼之前，請先熟悉 VS Code 的 GUI 和功能。
VS Code 代碼具有許多功能，讓您可以：
- 選擇主題，並更改編輯器的外觀。
- 打開您的專案資料夾，這樣您就可以快速地在檔案之間來回切換，並確保您的檔案結構正確。
- 添加源代碼控制系統，如 Git。
- 快速從市場上添加擴展等等。
這僅僅是 VS Code 所能提供的一小部分。看看每個功能如何幫助您的工作流程。也許從更改主題開始會是一個好的開始。
1. 從「入門」頁面中選擇您喜歡的編輯器主題，將其他設置保持默認，並點擊「完成標記」（左下角）。
如果淺色和暗色主題不適合您的口味，點擊「查看更多主題」，尋找一個引起您興趣的主題。
2. 接下來，探索 VS Code 最左側的部分，即活動欄，它有七個主要區域。但首先從其中一個最重要的區域開始，即資源管理器（Ctrl+Shift+E / Cmd+Shift+E）。
資源管理器顯示您項目中的文件和文件夾，您可以在其中克隆存儲庫。此外，資源管理器還允許您執行以下不同的操作：
- 在您的項目中創建、刪除和重命名文件和文件夾。
- 通過將文件和文件夾拖放到項目文件夾內來移動它們。
請注意，當從 VS Code 外部將文件拖放到資源管理器中時，“拖放”功能是有效的。但如果資源管理器為空，VS Code 將在編輯器中打開該文件。
3. 點擊搜索圖示（Ctrl+Shift+F / Cmd+Shift+F），這將打開搜尋部分，您可以在其中搜索您的項目文件、符號和文本。
4. 現在，點擊源代碼控制圖示（Ctrl+Shift+G / Cmd+Shift+G）以打開源代碼控制部分，在這裡您可以使用Git或其他源代碼控制系統管理您的項目。
VS Code帶有集成的源代碼控制管理（SCM），默認包括Git支持。
5. 在源代碼控制之後，點擊運行和調試圖示（Ctrl+Shift+D / Cmd+Shift+D），這將打開運行和調試：運行部分，您可以在其中運行和調試您的項目。
6. 最後，點擊擴展圖示（Ctrl+Shift+X / Cmd+Shift+X）以訪問擴展部分，在這裡您可以從市場安裝擴展。
通過命令行環境啟動VS Code
也許您大部分時間都在命令行環境中，但需要快速編寫一些代碼。如果是這樣，配置VS Code以通過命令行環境啟動將對您有利。
1. 在VS Code上按（Cmd+Shift+P或Ctrl+Shift+P）以打開命令面板，您可以在其中訪問所有VS Code的功能。
2. 在命令面板中輸入Shell Command: Install ‘code’ command in PATH，然後按Enter。此命令將將VS Code可執行文件添加到系統的PATH變量中。
3. 添加後，重新啟動您的終端機以使更改生效。 現在在您的終端機中可以使用code命令。
4. 現在，創建一個文本文件，添加一些文本，然後保存並關閉該文件。
5. 最後，運行以下命令來啟動 VS Code（code），並傳入您的文本文件的文件路徑（text.txt），在這種情況下，從工作目錄。
您將看到 VS Code（右側）打開，並在編輯器窗口中顯示您的text.txt文件的內容。 您現在可以使用 VS Code 的優秀功能編輯此文件。
安裝擴展以添加功能
關於 VS Code 的最好之一是它可以高度自定義。 如何？ 您可以安裝擴展以添加新功能，並且有許多不同的擴展可用。
也許您想安裝macOS Color Picker 擴展。 此擴展允許您在處理 CSS、HTML 和 JavaScript 文件時選擇原生 macOS 調色板。
1. 在活動欄中導航到 Extensions 選單，該選單有三個部分：
- INSTALLED – 此部分顯示已安裝的擴展。
- 推薦 – 本部分根據您打開的文件類型顯示推薦的擴展。例如，如果您使用JavaScript文件，您將看到推薦的JavaScript擴展。
- 熱門 – 此部分顯示最受歡迎的VS Code擴展。
2. 在搜索框中輸入macOS Color Picker，然後按Enter鍵。將以降序顯示匹配的擴展（首先是最匹配的擴展）的列表。
一旦看到目標擴展，單擊擴展旁邊的安裝按鈕。安裝按鈕變為綠色的啟用按鈕，請點擊啟用擴展。
安裝擴展後，擴展的概覽頁面顯示在右側，如下所示。
3. 現在打開CSS、HTML或JavaScript文件以測試新的macOS Color Picker擴展。
4. 最後，打開命令選單（Cmd+Shift+P / Ctrl+Shift+P），輸入Open Color Picker，然後按Enter。macOS Color Picker窗格將打開，如下所示。
使用顏色選擇器選擇一種顏色，該顏色將插入到您的代碼中。這個擴展是一種快速獲取所需顏色值而無需記住十六進制代碼的好方法。
結論
在本教程中，您學到了如何在Mac上安裝VS Code以及添加更多功能的擴展，使編寫代碼更加愉悅。此時，您可以充分利用VS Code在下一個項目中的所有功能。
但不要在这里停下！有了这些新的知识，为什么不使用版本控制和Git以及GitHub来跟踪您的工作呢？
Source:
https://adamtheautomator.com/visual-studio-code-on-mac/