VS Code Pets,一邊寫程式一邊養隻療癒小寵物吧

閱讀時間約 3 分鐘

本篇要解決的問題

看到「寵物」就知道,本篇要解決的問題就是我們人類的空虛心靈(咦?)。
開玩笑的 XD,前陣子滑新聞時,有瞄到「code」、「pet」的字眼,當時沒點進去看,只是有個印象。
在過完夢幻的十天年假後,第一篇文章不想太有壓力,想來點輕鬆的,就在 VS Code 上搜尋了「Pet」,排名第一的就是今天要介紹的「VS Code Pets」。
安裝數破 30 萬的 vscode-pets
用了一下後覺得蠻有趣的,開工後就一直讓幾隻小貓在 VS Code 上跑來跑去,也想分享給大家,於是整理了這篇使用筆記文。

安裝 vscode-pets

常用 VS Code 進行開發的攻城獅們,就不用看這段了,因為安裝延伸模組很簡單,但為了這篇可以湊一些字數就還是寫一下(有沒有這麼直接?)。
在 VS Code 上,點擊左側選單中的「延伸模組」:
安裝 vscode-pets
接著搜尋框中輸入「pet」,看到的第一個最多人安裝的就是了,按下「安裝」後不用幾秒就會安裝成功。
安裝成功,會看到原本寫「安裝」二個字的按鈕,變成停用、解除安裝。
安裝成功

來放寵物吧

安裝完 vscode-pets,VS Code 左側選單點擊最上面的「檔案總管」,就會看到檔案清單的下方新增了一塊「VS CODE PETS」,而且預設會有一隻黑白貓在那邊跑來跑去:
檔案總管會新增 VS CODE PETS
區塊標題「VS CODE PETS」的右邊有三個按鈕:
  • +:新增一隻寵物
  • o:丟一顆球給寵物咬爛
  • 垃圾桶:刪除一隻寵物
新增寵物時,會先選擇要新增什麼類型的寵物,目前有 10 種可以選擇:
選擇寵物類型
因為 August 是貓派,所以就用 cat 來示範(我是貓派我驕傲)。
選好寵物後,有幾種類型的寵物可以選擇花色,像是貓咪就可以選擇:
選擇寵物花色
選好了花色,最後會需要幫寵物取名字,目的是之後要刪除時,會用寵物名字來選擇。如果是取名字障礙症候群的患者也不用擔心,預設會隨機提供一個名字:
為寵物取名字,或是直接使用隨機名
取完名字後,就會看到視窗中多了一隻可愛寵物啦~
新增寵物成功
上面的截圖,寵物出現一個愛心 ❤ 的圖示,代表他們寵物之間認識了彼此。
滑鼠移到寵物身上,就會出現揮手 👋 的圖示,代表在跟奴才(不要懷疑就是在說你)打招呼:
跟我們打招呼

用指令看功能

不要被標題的「指令」二個字嚇傻了,其實就是我們要使用延伸功能時會按的:
  • MacOS:Cmd(⌘) + Shift + P
  • Windows / Linux:Ctrl + Shift + P
按下去以後,就可以輸入關鍵字來看延伸功能的更多功能,我們輸入:
pet coding
就會看到總共有以下功能可用:
用指令可以有更多功能
Roll-call 這個很好玩,就是所有的寵物會報數刷存在感:
報數啦

用擴充設定改變場景

如果覺得寵物太小不夠安慰我們被廠商欺負的幼小心靈,可以透過擴充設定來改變。
VS Code 左側選單再選到延伸功能,一樣在 input 的框輸入 pet,接著點擊 vscode-pets 右下角的小齒輪圖,點擊「擴充設定」:
進到 vsocde-pets 的擴充設定
點擊了以後,就可以看到 vscode-pets 的設定:
vscode-pets 設定
Pet size 就是可以改變寵物大小的。
Theme 則是可以改變背景,目前有 none、forest、castle、beach 四種可選,選了以後就會看到愛寵們在不一樣的地方奔跑:
可以換場景
官方有提供說明文件,如果想了解更多可以點看 文件 來看。
最後,不得不說,看看攻城獅的內心有寂寞,就算知道是假狗假貓也覺得開心跟被安慰 😂。
9會員
19內容數
沙龍到底是…做什麼用的勒?
留言0
查看全部
發表第一個留言支持創作者!
Let's Write 的沙龍 的其他內容
2023 年 3 月第 3 週:OpenAI GPT-4 降臨。微軟推出 Microsoft 365 Copilot,Office AI 助手。FBI 首長:中國可透過 TikTok 控制數據 影響對台論述。IG 業配行情及技巧。
這篇文章教你如何使用 DOM to Image 進行網頁截圖。內容包括如何安裝和使用 DOM to Image,注意事項,以及一個實用的 Demo 和原始碼。文章還探討了 Notion AI 生成的文章,並在最後提供了一個關於生成式 AI 影響的彩蛋。
這篇文章教你如何使用 heic2any.js 來轉換 HEIC 格式的圖片。內容包括 HEIC 格式的介紹、如何使用 heic2any.js、處理從 iPhone 上傳的 HEIC 格式圖片,以及處理 API 回應的 HEIC Base64 格式圖檔的方法。文章提供了實用的 Demo 和原始碼。
2023 年 3 月第 3 週:OpenAI GPT-4 降臨。微軟推出 Microsoft 365 Copilot,Office AI 助手。FBI 首長:中國可透過 TikTok 控制數據 影響對台論述。IG 業配行情及技巧。
這篇文章教你如何使用 DOM to Image 進行網頁截圖。內容包括如何安裝和使用 DOM to Image,注意事項,以及一個實用的 Demo 和原始碼。文章還探討了 Notion AI 生成的文章,並在最後提供了一個關於生成式 AI 影響的彩蛋。
這篇文章教你如何使用 heic2any.js 來轉換 HEIC 格式的圖片。內容包括 HEIC 格式的介紹、如何使用 heic2any.js、處理從 iPhone 上傳的 HEIC 格式圖片,以及處理 API 回應的 HEIC Base64 格式圖檔的方法。文章提供了實用的 Demo 和原始碼。
你可能也想看
Google News 追蹤
Thumbnail
這個秋,Chill 嗨嗨!穿搭美美去賞楓,裝備款款去露營⋯⋯你的秋天怎麼過?秋日 To Do List 等你分享! 秋季全站徵文,我們準備了五個創作主題,參賽還有機會獲得「火烤兩用鍋」,一起來看看如何參加吧~
Thumbnail
理解一個全新的操作環境有時候可能是一個挑戰,尤其對於那些剛開始接觸VS Code的開發者來說,即便具備一定的英文閱讀能力,可能也會對這個陌生的操作環境感到徬徨和不安。不過,沒有必要擔心,我們接下來就來一起用短短的一分鐘時間,將VS Code轉換成最熟悉的中文環境吧! 安裝繁體中文語言包 由於VS
Thumbnail
教大家讓 vscode 連上遠端電腦中的 docker 環境之中,步驟詳細且附圖
Thumbnail
本篇將不同 Sass 學習資源彙整在此,作爲學習筆記,大多來自 w3schools 和六角學院,相關連結也一並記錄下來,以便可以隨時查看、更新。
Thumbnail
微軟想把 VS 的一些編輯功能在 VS Code 上實作, Unity 也在幾天前推出了基於 C# Dev Kit 的插件,因為新舊版本並不相容,這邊說明兩種(OmniSharp、Roslyn Analyzers)開發環境設置。
Thumbnail
1. 安裝VS Code 1-1. Ctrl-K-T 換主題顏色 1-2. 加上基本插件(外掛) A. python擴展插件 關鍵字高亮, 智慧指令提示 Python解釋器切換 B. 使用中文插件 C. 使用Code runner才有三角形執行鈕
Thumbnail
第一:vs和v.s. 第二:ex.和e.g. 第三:et al.和ibid. 第四:NG和MV
Thumbnail
本篇目標:ftp-simple 連接與使用 本篇適合:需要使用Visual Studio Code 連接伺服器進行程式寫作的朋友 過去因為在實驗室的經驗,所有的程式皆存放在實驗室的伺服器上,因此我們會需要用本機的電腦嘗試連接到伺服器進行寫作。
Thumbnail
渡邊太太carry trade空日圓賺的缽滿盆溢;哈日族「鈔」前部署搶買日圓,沒有最低、只有日日新低…
Thumbnail
0050、006208會推薦哪個做長期定期定額投資呢?已知這兩檔都是追蹤同一個指數,但一個規模大、流動性佳;另一個則是管理費較少。 Hi, O丞: 簡單的答案是:「沒差,都可以」。就像朋友問你中午要吃什麼一樣,何必每天都要吃一樣的?......^^|| 輪流買也行~(我認真的) 若要看似有點學問的答
Thumbnail
這個秋,Chill 嗨嗨!穿搭美美去賞楓,裝備款款去露營⋯⋯你的秋天怎麼過?秋日 To Do List 等你分享! 秋季全站徵文,我們準備了五個創作主題,參賽還有機會獲得「火烤兩用鍋」,一起來看看如何參加吧~
Thumbnail
理解一個全新的操作環境有時候可能是一個挑戰,尤其對於那些剛開始接觸VS Code的開發者來說,即便具備一定的英文閱讀能力,可能也會對這個陌生的操作環境感到徬徨和不安。不過,沒有必要擔心,我們接下來就來一起用短短的一分鐘時間,將VS Code轉換成最熟悉的中文環境吧! 安裝繁體中文語言包 由於VS
Thumbnail
教大家讓 vscode 連上遠端電腦中的 docker 環境之中,步驟詳細且附圖
Thumbnail
本篇將不同 Sass 學習資源彙整在此,作爲學習筆記,大多來自 w3schools 和六角學院,相關連結也一並記錄下來,以便可以隨時查看、更新。
Thumbnail
微軟想把 VS 的一些編輯功能在 VS Code 上實作, Unity 也在幾天前推出了基於 C# Dev Kit 的插件,因為新舊版本並不相容,這邊說明兩種(OmniSharp、Roslyn Analyzers)開發環境設置。
Thumbnail
1. 安裝VS Code 1-1. Ctrl-K-T 換主題顏色 1-2. 加上基本插件(外掛) A. python擴展插件 關鍵字高亮, 智慧指令提示 Python解釋器切換 B. 使用中文插件 C. 使用Code runner才有三角形執行鈕
Thumbnail
第一:vs和v.s. 第二:ex.和e.g. 第三:et al.和ibid. 第四:NG和MV
Thumbnail
本篇目標:ftp-simple 連接與使用 本篇適合:需要使用Visual Studio Code 連接伺服器進行程式寫作的朋友 過去因為在實驗室的經驗,所有的程式皆存放在實驗室的伺服器上,因此我們會需要用本機的電腦嘗試連接到伺服器進行寫作。
Thumbnail
渡邊太太carry trade空日圓賺的缽滿盆溢;哈日族「鈔」前部署搶買日圓,沒有最低、只有日日新低…
Thumbnail
0050、006208會推薦哪個做長期定期定額投資呢?已知這兩檔都是追蹤同一個指數,但一個規模大、流動性佳;另一個則是管理費較少。 Hi, O丞: 簡單的答案是:「沒差,都可以」。就像朋友問你中午要吃什麼一樣,何必每天都要吃一樣的?......^^|| 輪流買也行~(我認真的) 若要看似有點學問的答