Github最近在內(nèi)測一款新的秘密武器代碼空間服務(wù)，一種由Visual Studio Code支持的在線瀏覽器內(nèi)集成開發(fā)環(huán)境。該服務(wù)可以讓用戶快速加載虛擬機和完整的集成開發(fā)環(huán)境 (IDE)，用戶只需通過瀏覽器就進行代碼編輯和調(diào)試，支持對常見語言的調(diào)試。

代碼空間包括為特定倉庫開發(fā)所需的一切，其中包括具有語法突出顯示和自動完成功能的文本編輯器、終端、調(diào)試工具和 Git 命令，所有這些都集成在 GitHub 中。也可以在代碼空間中安裝 Visual Studio Code 擴展以添加更多功能。

使用Gitlab的同學可能都用過Gitlab的WebIDE，Github代碼空間的使用類似于此，但是基于VSCode，體驗效果可能會更好。目前該服務(wù)屬于Beta內(nèi)測階段，需要發(fā)出請求申請內(nèi)測，經(jīng)過審核后才能嘗試。

初探

GitHub代碼空間和倉庫緊密相關(guān)，獲得內(nèi)測資格后，有關(guān)倉庫的右側(cè)項目概覽部分就有一個按鈕"Open with Codespaces"，打開該按鈕就可以進行代碼編輯。無需任何額外配置，馬上即可在線工作。

也可以通過Github頁面的頂部的頂級菜單Codespaces，打開代碼空間。

然后選擇要打開的具體項目：

加載代碼空間需要花費一點時間。GitHub代碼空間界面是典型的VSCode界面，左邊是活動欄，側(cè)邊欄、編輯欄，面板欄和狀態(tài)欄。

很明顯，是基于Visual Studio Code，還是典型的暗模式。整個界面包瀏覽器期望的所有標準功能，例如語法突出顯示，ViM和Emac綁定(在瀏覽器中很好用)以及默認啟用的自動保存。

還可以將文件從本地計算機拖放到Codespaces文件系統(tǒng)中，并在瀏覽器中預(yù)覽和編輯某些非文本文件，例如圖像，這兩個文件對于Web開發(fā)都是非常方便的。

終端模擬器

GitHub代碼空間包含一個功能強大的終端編輯器，該編輯器似乎基于Debian鏡像。使用下拉列表而不是使用選項卡訪問單獨的終端。而且重要的，該終端下也能運行Docker。

能夠在瀏覽器中簡單運行Docker很棒。默認情況下未安裝Docker-compose，目前其工作模式我們還不得而知，以后可以了解下。

在終端仿真器中發(fā)現(xiàn)的唯一問題是，只能通過右鍵單擊將其粘貼到基于Chromium的瀏覽器(例如Chrome或Edge)，F(xiàn)irefox好像不行。

代碼轉(zhuǎn)發(fā)

端口轉(zhuǎn)發(fā)使我們可以訪問在代碼空間中運行的TCP端口。例如，如果在端口3000上運行Web應(yīng)用程序，則可以從瀏覽器訪問該應(yīng)用程序以對其進行測試和調(diào)試。

Github代碼空間在處理端口轉(zhuǎn)發(fā)方面做得很出色，當代碼空間內(nèi)運行的應(yīng)用程序?qū)⒍丝谳敵龅娇刂婆_時，代碼空間將檢測到localhost URL模式并自動轉(zhuǎn)發(fā)這些端口?？梢酝ㄟ^單擊終端中的URL，以在瀏覽器中將其打開。例如，如果應(yīng)用程序輸出http://127.0.0.1:3000或輸出http://localhost:3000到控制臺，日志將自動將輸出。如果GitHub檢測到localhost:PORT組合，就可以通過單擊URL對其進行訪問，如下所示：

示例中的Jekyll加載和重新加載很快，當單擊轉(zhuǎn)發(fā)的鏈接或切換選項卡以預(yù)覽站點的更改時，它就會刷新站點。該功能僅支持Chromium的功能，在Firefox中好像也有問題。

• 可以通過通過觸發(fā)命令面板(shift+command+P或者shift+control+P)并，輸入"Codespaces: Forward Port"來按需轉(zhuǎn)發(fā)端口。然后，可以輸入要轉(zhuǎn)發(fā)的端口號。
• 也可以通過.devcontainer.json文件中的forwardPorts屬性配置轉(zhuǎn)發(fā)的端口。

在"Remote Explorer遠程資源管理器"擴展中支持添加或刪除轉(zhuǎn)發(fā)的端口，并可以復制并粘貼轉(zhuǎn)發(fā)端口的URL，可以在瀏覽器中通過該Url訪問。

總結(jié)

這是一個非常棒的功能，可以幫助那些不是很專門的開發(fā)人員進行在線開發(fā)。專業(yè)開發(fā)人員也可以偶爾用來應(yīng)急代碼調(diào)試，這樣就不需要時常背著笨重的筆記本了。

另外GitHub代碼空間還有很其他的功能包括協(xié)作工作區(qū)，Git集成以及與Visual Studio本地版本的連接。還需要大家一起探索學習。