遠端開發更勝一籌

2022年12月7日，由 Brigit Murtaugh (@BrigitMurtaugh) 釋出

Visual Studio Code 的核心是一個程式碼編輯器，它透過我們的遠端開發體驗與其他環境整合，從而變得更加強大和靈活。

您可能沒有想過，VS Code 有一個內建的命令列介面 (CLI)，可讓您控制如何啟動和管理編輯器——您可以透過命令列選項開啟檔案、安裝擴充套件和輸出診斷資訊。

CLI 在使用 VS Code 桌面的工作流程中非常有用，但之前存在一個空白：您無法用它啟動遠端例項。因此，我們希望透過拉近本地和遠端的距離來填補這個空白，使 CLI 變得更加強大。

今天，我們很高興地與大家分享我們增強版的 code CLI，它能讓您從 VS Code 桌面版或 vscode.dev 啟動 VS Code 並遠端連線到一臺機器。更新後的 CLI 已內置於最新的 VS Code 版本中，並且也提供獨立安裝包，因此您可以建立到任何計算機的安全連線並進行遠端連線，即使您無法在其上安裝 VS Code 桌面版。

除了新的 CLI，我們還進行了以下更新以改進遠端開發：

• 您可以直接從 VS Code 使用者介面啟用隧道。
• 隧道不再處於私有預覽階段——任何人都可以建立和使用隧道，無需註冊。
• 我們重新命名了兩個遠端擴充套件，以更清晰地說明它們的工作方式以及它們可以在哪些方面幫助開發。
  • “Remote - WSL” 擴充套件現在簡稱為 WSL。
  • “Remote - Containers” 擴充套件重新命名為 Dev Containers，以反映其用於建立開發環境的用途。

一個工具，隧道連線到任何地方

隧道技術可以安全地將資料從一個網路傳輸到另一個網路。您可以使用安全隧道，透過 VS Code 桌面版或網頁版客戶端在您選擇的任何機器上進行開發，而無需費力設定 SSH 或 HTTPS（當然，如果您願意，也可以這樣做 😊）。

您有兩個很好的選擇來從 VS Code 隧道連線到遠端機器：

• 使用新增的、增強版的 code CLI。
• 直接從 VS Code 使用者介面啟用隧道。

我們將在以下部分探討這兩種選擇。

增強版 code CLI

當我們釋出 VS Code Server 時，我們提到了我們的長遠願景，即將其整合到 code CLI 中。我們現在已經實現了這一目標，並且還提供了獨立安裝包，以防您在無法安裝 VS Code 桌面版的虛擬機器或受限機器上工作。

以下是安裝 code CLI 並用它建立安全隧道的步驟。如果您曾試用過 VS Code Server 的私有預覽版，這些步驟會非常相似。

注意： 如果您在 VS Code Server 的私有預覽期間使用了獨立的 code-server CLI，您現在應該改用最新的 code CLI（透過最新的 VS Code 桌面版或獨立下載）。

1. 在您希望透過本地 VS Code 客戶端進行開發的遠端機器上安裝 code CLI。這可以是一臺遠端桌面、虛擬機器，甚至是一個 Windows Subsystem for Linux (WSL) 發行版。

   CLI 已自動包含在您現有的 VS Code 安裝中——無需額外設定。如果您沒有安裝 VS Code 或無法在遠端機器上安裝它，您可以在我們的下載頁面透過獨立安裝包獲取 CLI。

   

   注意： 如果您使用獨立安裝包，以下部分中的命令將以 ./code 而不是 code 開頭。

2. 使用 help 命令仔細檢查 CLI 是否安裝成功：

   code -h
   

   您可以使用以下命令探索與隧道相關的特定命令：

   code tunnel -h
   

   既然您已經安裝了 CLI，讓我們為這臺機器設定隧道，以便您可以從任何 VS Code 客戶端連線到它。

3. 使用 tunnel 命令建立一個安全隧道：

   code tunnel
   

   此命令會在這臺機器上下載並啟動 VS Code Server，然後建立一條指向它的隧道。

   注意： 當您首次在機器上啟動隧道時，系統會提示您接受伺服器許可條款。您也可以在命令列上傳遞 --accept-server-license-terms 以避擴音示。

4. 此 CLI 將輸出一個與此遠端機器繫結的 vscode.dev URL，例如 https://vscode.dev/tunnel/<machine_name>/<folder_name>。您可以從任何您想要的機器上開啟這個 URL。

5. 當在客戶端上首次開啟 vscode.dev URL 時，系統會提示您在一個 https://github.com/login/oauth/authorize... URL 登入您的 GitHub 帳戶。這會向隧道服務驗證您的身份，以確保您有權訪問正確的遠端機器集。

恭喜，您已成功安裝並使用了 code CLI 最新的隧道功能！

從 VS Code UI 啟用隧道

如果您在遠端機器上安裝了 VS Code，您也可以選擇直接從 VS Code UI 建立隧道。如果您已經在 VS Code 中工作，這是一種快速、便捷的方式來為您的機器啟用遠端訪問。

在您的遠端機器上開啟 VS Code。在 VS Code 帳戶選單中，選擇 開啟遠端隧道訪問... 選項，如下圖所示。您也可以開啟命令面板 (F1) 並執行 Remote Tunnels: Turn on Remote Tunnel Access... 命令。

系統會提示您登入 GitHub。登入後，隧道將在這臺遠端機器上啟動，您將能夠連線到它。

在您選擇的客戶端中，您可以從上面的通知中開啟 vscode.dev 連結並開始編碼！

透過遠端隧道連線

Remote - Tunnels 擴充套件管理您的本地和遠端機器之間的這些安全隧道。您透過 code CLI 或 VS Code UI 開啟的 vscode.dev 例項都預裝了 Remote Tunnels 擴充套件。

如果您已在 VS Code 客戶端（桌面版或網頁版）中工作，並希望連線到遠端隧道，您可以直接安裝並使用 Remote - Tunnels 擴充套件。安裝擴充套件後，開啟命令面板 (F1) 並執行命令 Remote Tunnels: Connect to Tunnel。您將能夠連線到任何具有活動隧道的遠端機器。

您還可以在遠端資源管理器中檢視您的遠端機器，您可以透過命令 Remote Explorer: Focus on Remote View 開啟它。

移除隧道或機器

如果您想停止透過 CLI 執行的隧道，請使用 Ctrl + C 結束活動連線。如果您是透過 VS Code UI 啟用的隧道，請執行命令 Remote Tunnels: Turn off Remote Tunnel Access...。

您可以透過在該機器上執行 code tunnel unregister 來移除機器與隧道的關聯。在 VS Code 中，選擇遠端資源管理器檢視，右鍵單擊您想要移除的機器，然後選擇 unregister。

遠端開發擴充套件

除了對隧道和 code CLI 的更新外，我們還對我們的遠端開發擴充套件進行了一些更新，這些擴充套件允許您將開發容器、遠端機器或 WSL 作為功能齊全的開發環境來使用。

WSL 和 Dev Containers

我們聽取了您關於 Remote - WSL 和 Remote - Containers 副檔名稱的反饋。我們原本打算用 Remote 來表示您是在一個“遠端”或“分離”的 WSL 發行版或開發容器中進行開發，而不是傳統的本地開發。然而，這種對“遠端”的用法與許多人的理解不同，並且可能引起混淆（例如，Dev Container 是在我本地機器上嗎？）。

我們更新了這些擴充套件中的命名和產品內命令，使其更加清晰，將它們重新命名為 WSL 和 Dev Containers。諸如應用商店中的擴充套件識別符號和文件連結等保持不變，因此您當前對這兩個擴充套件的使用不應出現問題。

Remote Tunnels

如上所述，您可以使用 Remote - Tunnels 擴充套件透過安全隧道連線到遠端機器，而無需 SSH。我們將擴充套件從“Remote Server”重新命名為“Remote - Tunnels”，因為我們相信這更清晰地表明瞭其行為（畢竟，該擴充套件是用於透過安全隧道在遠端機器上進行開發的！）。

結束語 – 感謝！

多年來，我們一直聽取您關於我們遠端體驗的反饋，以及最近關於 VS Code Server 的反饋——我們非常感謝您分享這些想法，這些想法持續塑造著我們的產品體驗。我們很高興看到您如何使用我們最新的遠端功能，並期待您的反饋！

如果您想更深入地瞭解這篇部落格中描述的工具，我們為 Remote - Tunnels 擴充套件建立了一個主題，同時更新了 VS Code Server 和 code CLI 的文件以反映最新的變化。

歡迎隨時在我們的 vscode-remote-release GitHub 倉庫中提交功能請求或錯誤報告，或者您也可以在 Twitter 上 @code 告訴我們您的想法。

編碼愉快！

Brigit Murtaugh, @BrigitMurtaugh