VSCode 雲同步擴充套件設定 Settings Sync 外掛

荔枝ee發表於2019-07-19

Hi、大家好,今天又是美好的一天。


關於 Settings Sync擴充套件:

Settings Sync可以同步你當前的VSCode配置環境,當你需要在其它的電腦工作時,您不用重頭再來一遍。新機器登入一下就搞定了。再也不用折騰環境了。

大致原理:使用GitHub Gist來同步多臺計算機上的設定,程式碼段,主題,檔案圖示,啟動,鍵繫結,工作區和擴充套件。

環境版本:

Visual Studio Code 1.36

Settings Sync 3.4.0

教程分為

初次使用 如何上傳配置(#1)

已有配置 直接下載(#2)

初次使用:

在VSCode中點選擴充套件,搜尋:Settings Sync 安裝

VSCode 雲同步擴充套件設定 Settings Sync 外掛

安裝好擴充套件之後我們登入GitHub開通並建立一個Gist(程式碼片段管理服務)來儲存你的環境配置。

Let's to it

登入你的Github 點選頭像 進入Settings頁面

在Settings頁面點選進入 Developer settings (開發者設定)再點選進入Personal access tokens (個人授權令牌)頁面生成一個令牌 點選 Generate new token

VSCode 雲同步擴充套件設定 Settings Sync 外掛

令牌的作用能幫助我們就在VSCode中使用自己的私有令牌訪問自己的儲存在Gist上的配置

所以我們輸入令牌備註,勾選Gist,點選生成。

VSCode 雲同步擴充套件設定 Settings Sync 外掛

然後你就獲得了自己的Gist專屬訪問令牌,你可以用記事本儲存下來,待會並且未來你可能需要在另一臺電腦下載你的配置 你同樣需要使用到這個令牌。(截圖中生成Token演示後刪除,請自己生成)

VSCode 雲同步擴充套件設定 Settings Sync 外掛

然後再次點選你的頭像 點選進入->Gist頁面 點選建立一個新Gist

VSCode 雲同步擴充套件設定 Settings Sync 外掛

輸入建立的Gist描述和片段內容,儲存即可。

VSCode 雲同步擴充套件設定 Settings Sync 外掛

手動複製剛才建立的Gist倉庫的ID:它顯示在瀏覽器url最後一串字串或者截圖中第二個框gist冒號後面的字串(如下圖)把它儲存在你的記事本中

VSCode 雲同步擴充套件設定 Settings Sync 外掛

回到VSCode編輯器中 使用快捷鍵Ctrl+P 輸入命令 >sync 點選 同步:高階選項

ps:如果有問題,可以點紅框下面的 擴充套件設定重置 它不會清除你現有的擴充套件,只恢復初始sync的配置) 快捷鍵的用法是 Ctrl+P 輸入命令:>Sync: Reset Extension Settings

VSCode 雲同步擴充套件設定 Settings Sync 外掛

然後選擇同步:編輯配置設定(截圖中文翻譯錯誤)

VSCode 雲同步擴充套件設定 Settings Sync 外掛

輸入你在github上建立的gist token 記得使用Ctrl+S儲存更改

VSCode 雲同步擴充套件設定 Settings Sync 外掛

然後如下圖進入Settings Sync擴充套件設定頁面設定

VSCode 雲同步擴充套件設定 Settings Sync 外掛

輸入建立的Gist倉庫ID 輸入自動儲存設定

VSCode 雲同步擴充套件設定 Settings Sync 外掛

使用Settings Sync我們需要記住兩個快捷鍵:

Shift + Alt + U 將配置環境 擴充套件外掛資訊上傳到雲端

Shift + Alt + D 下載雲端的配置

所以我們接著上一步 直接在VSCode中使用Shift + Alt + U

Settings Sync擴充套件 會在輸出區域提示 這裡提示沒有擴充套件別移除(因為第一次同步) 然後6個擴充套件被同步。

VSCode 雲同步擴充套件設定 Settings Sync 外掛

你還可以在你的Gist倉庫中檢視,看看Settings Sync上傳了什麼

VSCode 雲同步擴充套件設定 Settings Sync 外掛

已有配置 直接下載同步遠端配置

假設我剛才是在用公司的電腦進行了一次初始化同步設定。現在我想起來我家裡的電腦已經設定好了,而且安裝的外掛更多,有的外掛我都忘記了名字。那麼我只需要拉取家中Settings Sync配置中對應的Gist ID即可做到 公司和家中用的是同一套VSCode的配置。

下面我們來實際操作一次。

檢視我們的Gist倉庫,獲取你想要拉取的Gist ID。截圖中,紅框中的就是昨晚我在家中最後同步的Gist配置了。點選進入 複製這個Gist ID

VSCode 雲同步擴充套件設定 Settings Sync 外掛

更改Settings Sync中的Gist ID設定:

VSCode 雲同步擴充套件設定 Settings Sync 外掛

快捷鍵Shift+Alt+D 下載配置

同步成功 需要重啟VSCode

PS:這裡可以思考一下,為什麼第一次設定Settings Sync需要建立Token 這裡就不需要設定Token了,其實你可以這麼理解 Gist ID 它用來標記你的倉庫號碼 你可能有多個倉庫 你的倉庫大門用的都是刷臉驗證(令牌Token驗證),也就是說。Token你只需要建立一個對應Gist的Token即可(多個也可以) 它們都可以開啟你的Token,因為在第之前我設定好了token,所以這裡我只需要設定好Settings Sync 相應的倉庫號碼。就可以完成同步了。

VSCode 雲同步擴充套件設定 Settings Sync 外掛

重啟後看到同步到了我最常使用的這個Gist配置。一共有31個擴充套件(雖然很多,但VSCode使用依然順滑)。

VSCode 雲同步擴充套件設定 Settings Sync 外掛

總結:

使用Settings Sync 需要明白 Gist ID和Token ID他們的作用。配置好之後使用快捷鍵 Shift+Alt+U(上傳)/D(下載)。

對於在使用過程中出現的一些錯誤 可以簡單三部曲:

1、擴充套件設定重置

它不會清除你現有的擴充套件,只恢復初始sync的配置) 快捷鍵的用法是 Ctrl+P 輸入命令:>Sync: Reset Extension Settings

2、更改Settings Sync配置文字

設定Token ID

3、設定Gist ID

然後同步上傳或者下載配置。

後言:

(吃) (我) (安) (利) Visual Studio Code :

  • 開源,免費,多語言支援(有中文)

  • 超全面的程式語言和各種檔案格式支援 詳見官網查詢 https://code.visualstudio.com/

  • 整合git

  • 自定義配置 語法高亮 自動提示 程式碼補全 多種主題 配合外掛擴充套件 可玩性極高

  • 智慧提示強大

  • 前端介面友好,想不到的絲滑 並且是開箱即用的

  • 除錯功能強大

  • 各種方便的快捷鍵

  • 強大的外掛擴充套件(你想要的基本都有 各類語言程式碼提示\除錯\更利於分辨好看的樣式 等等外掛) more:https://marketplace.visualstudio.com/

    下一期考慮寫一篇介紹VSCode 必裝 好用的 ★★五星★★外掛 讓人寫程式碼也能上癮

    Bye。

相關文章