VSCode連接微軟 TFS 版控

前言

大部份人應該都是使用 Git 做為版控,也幾乎內置於各大 IDE,可以直接無痛使用
而TFS就相當少數了
VSCode,微軟出品廣受好評的開源 IDE (我知他是文字編輯器,但相信90%的人都是當IDE使用…),居然先天不支援 TFS
而官方提供的套件,也早早就 archive,不在維護
後來發現不只VSCode,連 Intellij idea 等也是…

但偏偏公司就是使用 TFS,為了方便開發,花了不少時間研究這塊
最後成功在 VSCode 上連接 TFS,但使用起來仍不甚方便
不過至少算是到能用的情況了

雖然能用,但缺點很惱人

連接成功後,雖然可以在VSCode上比較正常的使用,但會有下列缺點

  1. 每次啟動VSCode皆須手動登入一次,使用tf.cmd不會自動登入;使用tf.exe可以登入成功,但不會有diff列表,仍須手動再登入一次功能才會正常
  2. 不像git,在檔案總管裡會把有修改的檔案變色顯示
  3. 使用TEE-CLC(即tf.cmd)的話,每次啟動都須點擊套件浮出的對話氣泡框”Learn more…”,否則會找不到指令!而且大約5秒鐘就會消失。若沒點到,就要重開VSCode等他冒對話氣泡。但若使用vs自帶的tf.exe,就可以不必點。雖然都是得手動登入一次,但tf.exe至少可以不受惱人的氣泡視窗影響

作法

0. 透過 VS 或 Team Explorer 同步專案

TFS 完整的功能還是得透過微軟提供的工具來操作
可以的話,還是建議同單位的開發者都有安裝
不想安裝整套 VS 的話,微軟也有提供 Team Explorer 單純使用版控工具

而在 VSCode 增加 TFS 功能
主要是方便日常維護時可以直接推版
不必一直另開工具來控制版控,有比較大的操作(如開分支…等)時,再來開Team Explorer操作

1. 安裝VS,取得tf.exe

連接TFS,還必須要求先安裝好VS,否則無法使用!

雖然有提供TEE-CLC這種精簡包

但在VSCode上用起來就是有點小狀況,即這個ISSUE:Error: command ‘team.signin’ not found

每次VSCode啟動時,若沒點擊”Learn more…”,當要登入TFS,就會出現command not found

建議還是先安裝 VS,取出他的 tf.exe 來使用較佳
雖 tf.exe 也是差不多的情況,但使用體感略略好一些,因可以不必點擊惱人的氣泡對話
就不會出現command 'team.signin' not found的問題

而只需要一台安裝好VS
C:\Program Files (x86)\Microsoft Visual Studio\2019\Professional\Common7\IDE\CommonExtensions\Microsoft\TeamFoundation裡的Team Explorer整個目錄拷貝出來使用即可

  1. 至上述路徑拷貝Team Explorer放到指定路徑(如D:\)
  2. 將拷貝出來的語言目錄:zh-Hanszh-Hant重新命名為zh-Hans_zh-Hant_。因中文語系會造成tf.exe使用問題
  3. 將中文語系目錄重新命名後,tf抓不到,就會自動使用預設的英文

2. 打開VS Code,安裝套件Argutec Azure Repos

打開VS Code,至market下載套件
在套件這塊有2個選擇

  1. TFVC for VS Code

    只要指定好tf.exe路徑,就可以無痛使用。算是最簡單的
    但無法判斷新增加的檔案,也就是只有現有的程式碼 modify 時會感知到

  2. Argutec Azure Repos

    推薦使用這個,用起來最接近 VS 上的 TFS,功能相對完整
    但每次啟動VS Code都得手動登入一次,較為惱人

後面步驟就以Argutec Azure Repos為主,畢竟實務開發上,不可能永遠不會有增減檔案…

3. 設定url、restrict folder,取消勾選歡迎

安裝好後
打開喜好設定,直接搜尋azure,就會帶出Argutec Azure Repos所有設定頁面
設定以下功能

  1. remoteUrl,輸入公司內部的tfs網址。注意,底下有個Team Project留空,之前有試著輸入,但會造成連線失敗
  2. Location,指定到拷貝出來的tf.exe或前面下載下來的TEE-CLC裡的tf.cmd
  3. 勾起Restrict Folder,因有可能有多個專案,勾起來可避免VS Code看到其他專案,混亂commit操作
  4. 取消勾選Show Welcome Message
    a. 使用tf.exe,取消勾選後可看到左下角自動登入成功(但實際上只算成功一半)
    b. 若使用tf.cmd,就不要取消了。因一定要點擊learn more才可以正常登入…

4. 登入自己的帳號

  1. 打開專案
  2. 按f1
  3. 輸入team,選到team: signin
  4. 輸入ad帳密
  5. VSCode左下角,可以看到是否登入成功的訊息
  6. VSCode左邊選到版本控制頁籤,試著改一些檔案,應該可以看到順利感知到修改情況。而操作方式跟一般TFS一樣,有「暫止的變更」與「排除的變更」

重啟VSCode,打開專案,仍可以看到左下角自動登入成功了
點擊也確實可以帶到專案

但切到版控頁籤時,會發現所有修改的感知都不見了

tf.exe

tf.exe,只要再次觸發signin即可
如下:

  1. 按 f1
  2. 輸入team
  3. 選到teams: signin重新登入

    tf.cmd

    tf.cmd,會看到每次啟動時的welcome page,一定要點擊learn moreset TFVC Support
    若未點擊,直接f1 > signin,就會出現command 'team.signin' not found
    而此氣泡對話約5秒後會消失,若剛好一忙沒點到,就重開專案吧….

參考資料

GitHub issue / Error: command ‘team.signin’ not found