現已釋出!閱讀關於 11 月新增功能和修復的內容。

GitHub Codespaces

GitHub Codespaces 為任何活動提供雲驅動的開發環境 - 無論是長期專案,還是諸如審查拉取請求之類的短期任務。你可以使用 Visual Studio Code 或基於瀏覽器的編輯器來處理這些環境。

GitHub Codespaces extension

環境

環境是 GitHub Codespaces 的“後端”部分。軟體開發中涉及的所有計算都在這裡進行:編譯、除錯、還原等。當你需要處理新專案、接手新任務或審查拉取請求時,只需啟動一個雲託管環境,GitHub Codespaces 就會負責正確配置它。它會自動配置你專案所需的一切:原始碼、執行時、編譯器、偵錯程式、編輯器、自定義 dotfile 配置、相關編輯器擴充套件等。

自定義

GitHub Codespaces 可針對每個專案進行完全自定義。透過在專案倉庫中包含 devcontainer.json 檔案來實現此目的,這類似於 VS Code 的 Dev Containers 開發。

自定義示例包括

  • 設定要使用的基於 Linux 的作業系統。
  • 自動安裝各種工具、執行時和框架。
  • 轉發常用埠。
  • 設定環境變數。
  • 配置編輯器設定並安裝首選擴充套件。

有關 codespace 特定的 devcontainer.json 設定,請參閱 配置 Codespaces 文件。

使用者配置的 dotfile

Dotfile 是檔名以點(.)開頭的。它們通常包含應用程式的配置資訊,並可控制終端、編輯器、原始碼控制和各種其他工具的行為。.bashrc.gitignore.editorconfig 是開發者常用的 dotfile 示例。

建立 codespace 時,你可以指定一個包含 dotfile 的 GitHub 倉庫、檔案的目標位置以及安裝命令。

有關如何將 dotfile 配置新增到 codespace 的資訊,請參閱 個性化 Codespaces 文件。

入門

對於 GitHub Codespaces 的兩個客戶端,都有入門主題。這些將幫助你快速完成登入 GitHub Codespaces、建立第一個 codespace 並使用首選客戶端連線到它的過程。

擴充套件作者

VS Code 擴充套件 API 隱藏了遠端執行的大部分實現細節,因此許多擴充套件無需修改即可在 GitHub Codespaces 環境中正常工作。但是,我們建議你在 codespace 中測試你的擴充套件,以確保其所有功能都按預期工作。有關詳細資訊,請參閱有關 支援遠端開發和 GitHub Codespaces 的文章。

基於瀏覽器的編輯器

你還可以完全在瀏覽器中獲得免費、輕量級的 Visual Studio Code 體驗。基於 Web 的編輯器可以讓你安全快速地瀏覽 GitHub 的原始碼倉庫,並進行輕量級程式碼更改。你可以使用編輯器開啟任何倉庫、fork 或拉取請求,它具有 VS Code 的許多功能,包括搜尋和語法高亮。如果你想執行或除錯程式碼,可以切換到雲託管環境或 VS Code 桌面版。

要訪問此基於瀏覽器的編輯器,你可以轉到 github.com 上的倉庫並按 .(句點鍵),或者將倉庫的 URL 更改為 github.dev/org/repo,將 github.com 替換為 github.dev

限制:如果你使用隱身模式執行瀏覽器或啟用了廣告攔截器,則可能無法使用基於 Web 的編輯器。

注意:此編輯器目前處於技術預覽階段。你可以立即嘗試並反饋給 https://github.co/browser-editor-feedback

已知限制和解決方案

在使用 Codespaces,特別是 Web 版 VS Code 時,需要注意一些限制。其中一些限制有解決方案或適應方法,以提供一致的開發體驗。

對於一些問題(特別是鍵盤快捷鍵或列有桌面版解決方案的問題),你可以將 Codespace 安裝並用作 漸進式 Web 應用 (PWA)。

Installing Codespaces as PWA in Microsoft Edge

問題 原因 解決方案
Ctrl+Shift+P 在 Firefox 中無法啟動命令面板。 Ctrl+Shift+P 在 Firefox 中已被保留。 使用 F1 啟動命令面板。
某些預設鍵盤快捷鍵(用於除錯)在 Web 版中有所不同。 由於瀏覽器可能已為這些鍵盤快捷鍵註冊了操作,因此我們調整了 Web 版 VS Code 的預設設定。 使用調整後的預設設定。它們會顯示在除錯操作的工具提示懸停中。
  • 在所有瀏覽器中,“逐過程”是 Alt+F10(而不是 F10)。
  • 在 Windows 瀏覽器中,Web 版的“逐行進入”是 Alt+F11(而不是 F11)。
在 macOS 的 Web 版或桌面版中,用於除錯的 F11 無法正常工作。 這是一個已知的、與瀏覽器無關的限制。有關更多資訊,請參閱 issue #5102 停用 macOS 上的 F11 以顯示桌面。
  • 轉到:系統偏好設定 > 鍵盤 > 快捷鍵
  • 取消勾選“顯示桌面 F11”選項
在 Web 版中,新建檔案的 Ctrl+N 無法正常工作。 Ctrl+N 會開啟一個新視窗。 在桌面版中,新建檔案的 Ctrl+N 可以正常工作。
在 Web 版中,關閉編輯器的 Ctrl+W 無法正常工作。 Ctrl+W 會關閉瀏覽器中的當前標籤頁。 在桌面版中,Ctrl+W 可以正常工作。
Ctrl+Shift+B 將無法在瀏覽器中切換收藏夾欄。 Codespaces 會覆蓋此設定並將其重定向到命令面板中的“構建”選單。 目前沒有解決方案。
從 VS Code 拖放檔案到 Codespace(反之亦然)不起作用。 你可以在 issue #115535 中檢視更多上下文。 有幾種選項
  • 你可以右鍵單擊 Codespace 中的檔案,將其下載到本地計算機。
  • 你可以將檔案從檔案資源管理器拖放到 Codespace。
在 Web 版中不支援 Angular 應用除錯。 出於安全原因,在瀏覽器中執行的程式碼無法以除錯模式啟動另一個瀏覽器例項。 你有幾種選擇
  • 正常除錯 Node.js/服務端 js。
  • 在桌面版中開啟 Codespace,在這種情況下,將使用 companion 來啟動你的本地 Edge 或 Chrome 安裝。
從瀏覽器下載沒有副檔名的檔案會自動新增“.txt” Chrome 和 Edge 的行為就是如此。 issue #118436 中提供上下文和潛在的未來解決方案。
從遠端(包括 Codespaces)下載檔案時,可執行位等屬性會被移除。 issue #112099 中可以找到上下文和潛在的未來解決方案。 目前沒有解決方案。
嘗試從 Codespace 下載某些資料夾時,可能會看到提示“Your_codespace_name 無法開啟此資料夾,因為它包含系統檔案”。 使用者代理可以自由地對敏感目錄施加限制級別。有關更多資訊,請參閱 此規範Chromium 的黑名單 除了規範和黑名單外,沒有額外的解決方案。
手動訪問 https://:forwarded_port 無法從 Web 版 Codespace 訪問轉發的埠。 這基於 Codespaces 處理埠轉發的方式以及為 Web 版生成正確 URL 的方式。 點選埠轉發通知中的連結開啟你的應用,或者點選“埠”檢視中的地球圖示,兩者都會提供正確生成的連結。有關更多資訊,請參閱 Codespaces 文件

某些擴充套件在 Web 版中的行為不同

擴充套件 問題/原因 解決方案
具有與瀏覽器快捷鍵重疊的鍵盤快捷鍵的擴充套件,例如 Git Graph,它使用 Ctrl+R 進行重新整理。 鍵盤快捷鍵可能與現有的瀏覽器快捷鍵重疊,例如 Ctrl+R 在 Safari 中重新整理視窗。 你可以使用基於桌面的 Codespace 而非基於 Web 的 Codespace 來充分利用鍵盤快捷鍵。不同的瀏覽器也可能表現不同(你可以在 Chrome 中重新整理 Git Graph)。
語言包,例如 Visual Studio Code 的日語語言包 目前不支援在基於 Web 的 Codespaces 中使用語言包擴充套件。 你可以使用桌面版 Codespace 來使用語言包並配置顯示語言。
Bracket Pair Colorizer 2 它在瀏覽器中無法正常工作,因為它引入了不易修復的安裝位置依賴項。 使用 Bracket Pair Colorizer
瀏覽器偵錯程式,例如 Firefox 偵錯程式 需要 UI/桌面擴充套件主機的擴充套件無法在瀏覽器中載入。 你可以在本地 VS Code 中(未連線到 Codespaces)使用這些擴充套件。或者,當你的應用從 Codespace 執行時,你可以使用替代方案,例如 Chrome DevTools 來檢查元素和設定斷點。
用於開啟瀏覽器的擴充套件,例如 在瀏覽器中開啟 需要 UI/桌面擴充套件主機的擴充套件無法在瀏覽器中載入。 如果可能,請使用替代擴充套件,例如 Live Server
專案管理器 專案管理器依賴於同步自定義的 projects.json 檔案,而該檔案 目前不支援 你可以在桌面版 Codespaces 或本地 VS Code 中使用該擴充套件來儲存和管理你的專案,因為這些選項不需要同步自定義檔案。
依賴 Chrome 的擴充套件,例如 Protractor Test RunnerBrowser Preview Chrome 未包含在 Codespace 中。 嘗試尋找替代體驗,或者你可以在本地 VS Code(未連線到 Codespaces)中的專案上使用這些擴充套件。
Flutter(以及 Flutter 開發整體) 由於 Docker 容器和 Codespaces 的性質,Flutter 工作流程的幾個方面受到限制。
  • Flutter 推薦從 snap 安裝,但 snap 無法在 Codespaces 容器中安裝。
  • Android 模擬器在容器中無法正常工作。
  • Codespaces 無法檢測插入你機器的 USB 裝置,這使得在物理裝置上進行開發成為不可能。
  • Codespaces 和其他 Linux 環境一樣,不支援 iOS 開發。
你可以使用本地 VS Code 進行 Flutter 開發。
LaTeX Workshop 該擴充套件提供三種功能來幫助 LaTeX 創作:1) 一組顯示常用命令的檢視,2) 一個 PDF 預覽器,以及 3) 語言功能,如片段和 IntelliSense。該擴充套件可以相對完整地使用,但存在一些 Web 或安全限制。 以下解決方案解決了檢視和預覽器功能領域的限制
  • 檢視本身可以正常工作,但其中一些命令嘗試啟動本地應用程式,例如在作業系統檔案瀏覽器中顯示輸出資料夾。這些在 Web 版中無效,因此使用桌面版是另一種選擇。
  • "latex-workshop.view.pdf.viewer" - 此設定提供一個類似於 Markdown 預覽的 PDF 預覽器。你可以在瀏覽器標籤頁、單獨的 PDF 檢視器或 VS Code 標籤頁中預覽。
    在基於 Web 的 Codespaces 中,只有瀏覽器標籤頁可用。單獨的 PDF 檢視器會靜默失敗,而 VS Code 標籤頁會遇到 內容安全策略問題。由於此限制,VS Code 標籤頁檢視器還有其他不可用的功能。
Git Graph 某些 Git Graph Webview 功能在 Codespaces 中可能受到限制。例如,在提交中的檔案和 Git Graph Webview 之間切換可能會導致 Webview 變為空白。 你可以在 VS Code 桌面版中完整地使用 Git Graph。
其他 遠端開發擴充套件(WSL、Dev Containers、Remote - SSH)無法在 Codespace 中安裝。 Codespace 已是遠端上下文。 如果你想在另一個遠端上下文中執行(例如 WSL 或遠端 SSH 計算機),請開啟桌面版 VS Code(未連線到 Codespace)並啟動其他遠端擴充套件之一。如果你想使用 自定義 dev container,可以在 Codespaces 和 Dev Containers 中使用相同的 .devcontainer
My_Favorite_Extension 無法正常工作且未在上方列出。 還有一些其他問題可能導致功能在遠端上下文中無法按預期工作。 在某些情況下,你可以使用另一個命令來解決問題,但在其他情況下,擴充套件可能需要修改。請檢視 遠端擴充套件技巧,瞭解常見的遠端問題和解決方法。

常見問題

為什麼擴充套件無法在瀏覽器中安裝

有少量擴充套件具有內建假設或需要在桌面環境中執行。例如,當擴充套件訪問桌面上的 VS Code 安裝中的檔案時,或者當擴充套件依賴於必須在桌面環境中執行的可執行檔案時。當你嘗試在瀏覽器中安裝此類擴充套件時,會收到通知,告知該擴充套件不可用。

請注意,在從桌面版 VS Code 連線到 Codespace 時,仍可使用此類擴充套件。

如何允許 VS Code 讀取我的剪貼簿?

在某些情況下,VS Code 可能會請求你允許訪問剪貼簿進行讀取。你應該能夠透過瀏覽器設定(搜尋“站點許可權”)或在位址列右側查詢此選項來授予訪問剪貼簿的許可權。

Allow clipboard access in browser

授予 VS Code 訪問剪貼簿的許可權後,你可以重試該操作。

如何允許 VS Code 始終開啟新標籤頁和視窗?

有時出於安全考慮,瀏覽器會阻止 VS Code 開啟新標籤頁或視窗。如果發生這種情況,VS Code 會檢測到阻止操作並明確提示使用者。但是,你可以透過瀏覽器導航欄中的上下文選單開啟站點設定,並允許“彈出視窗”,來允許 VS Code 始終開啟新視窗和標籤頁。

Allow pop-up window in browser

如何允許瀏覽器中的 VS Code 訪問本地檔案和資料夾?

從瀏覽器在 VS Code 中開啟本地檔案和資料夾需要瀏覽器支援 檔案系統訪問 API。目前,Microsoft Edge 和 Google Chrome 都提供此級別的支援。如果你想在使用瀏覽器版 VS Code 時訪問本地檔案和資料夾,請考慮切換到這兩個瀏覽器之一。

問題或反饋

如果你有疑問,可以查閱 GitHub Codespaces 的 故障排除指南。如果你想提供反饋,可以在 GitHub Codespaces 的 討論區提交 issues。

© . This site is unofficial and not affiliated with Microsoft.