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 四種可選,選了以後就會看到愛寵們在不一樣的地方奔跑:
可以換場景
官方有提供說明文件,如果想了解更多可以點看 文件 來看。
最後,不得不說,看看攻城獅的內心有寂寞,就算知道是假狗假貓也覺得開心跟被安慰 😂。
avatar-img
9會員
19內容數
沙龍到底是…做什麼用的勒?
留言
avatar-img
留言分享你的想法!
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
Cursor AI 教學指南 Cursor AI 是一款基於 Visual Studio Code (VS Code) 的 AI 驅動程式碼編輯器,專為提升程式開發效率而設計。 它整合了多種先進的 AI 模型(如 OpenAI 的 GPT-4 和 Anthropic 的 Claude 3.5
Thumbnail
最近正在準備開學第一、二週的簡報內容,如果簡報內需要用到數學公式也需要用到程式碼的話,使用powerpoint實在是有點麻煩,於是我決定使用Marp來讓我可以快速的製作簡報,使用VS code的extension的話,也很方便管理程式碼和簡報,這篇文章分享用Marp for VS Code來製作簡報
Visual Studio Code (VS Code) 是一款由微軟(Microsoft)開發的免費、開源的輕量級程式碼編輯器,廣泛用於編寫和管理程式碼。它功能強大,支持多種程式語言(如 Python、JavaScript、C++ 等),同時也有許多可擴展的插件和工具,適合初學者和專業開發者。
Thumbnail
除了直角座標系統外,極座標(polar coordinate)系統是另一種相當有用的座標系統。
Thumbnail
  有件事困擾我很久了,要不要養貓?但若下定決心要的話,我就要先搬家了呢,好猶豫…剛好朋友請我來記錄一下牠跟愛貓的日常,我決定把握機會實際體驗看看再做決定!因為他家愛貓貴妃比較害羞,遇到陌生人會躲起來,好再看過我幾次,雖然不會輕易靠近但至少不會太警惕,看來我是最佳人選呢。 到他家後先拍攝
首先要安裝vscode : Visual Studio Code - Code Editing. Redefined 安裝後我們就可以把她打開來,接著去檔案 -> 喜好設定 -> 設定檔(預設) -> 你就會看到設定裡面的 settings.json,就可以開始你的設定拉(主要是依照個人的喜好設定
Thumbnail
理解一個全新的操作環境有時候可能是一個挑戰,尤其對於那些剛開始接觸VS Code的開發者來說,即便具備一定的英文閱讀能力,可能也會對這個陌生的操作環境感到徬徨和不安。不過,沒有必要擔心,我們接下來就來一起用短短的一分鐘時間,將VS Code轉換成最熟悉的中文環境吧! 安裝繁體中文語言包 由於VS
Thumbnail
今天來了一個熱心的小夥伴,想跟家裡貓咪做溝通。 貓咪1號是一隻比較怕生的貓咪,小夥伴從外面收編了四個月,始終無法跟貓咪更親近。 我們溝通完,發現牠警戒心很高,比較想擁有自己獨立小房間。 小夥伴說有點難度,於是我們就提供他另外一個方法,請他把有自己味道的衣服放在籠子裡,讓貓咪習慣味道。 再
Thumbnail
CatHelper是我開發的前端 SideProject,是貓咪募資收養的一站式平台。 我用戶使用流程、資料庫、頁面來構思這個專案。
Thumbnail
Cursor AI 教學指南 Cursor AI 是一款基於 Visual Studio Code (VS Code) 的 AI 驅動程式碼編輯器,專為提升程式開發效率而設計。 它整合了多種先進的 AI 模型(如 OpenAI 的 GPT-4 和 Anthropic 的 Claude 3.5
Thumbnail
最近正在準備開學第一、二週的簡報內容,如果簡報內需要用到數學公式也需要用到程式碼的話,使用powerpoint實在是有點麻煩,於是我決定使用Marp來讓我可以快速的製作簡報,使用VS code的extension的話,也很方便管理程式碼和簡報,這篇文章分享用Marp for VS Code來製作簡報
Visual Studio Code (VS Code) 是一款由微軟(Microsoft)開發的免費、開源的輕量級程式碼編輯器,廣泛用於編寫和管理程式碼。它功能強大,支持多種程式語言(如 Python、JavaScript、C++ 等),同時也有許多可擴展的插件和工具,適合初學者和專業開發者。
Thumbnail
除了直角座標系統外,極座標(polar coordinate)系統是另一種相當有用的座標系統。
Thumbnail
  有件事困擾我很久了,要不要養貓?但若下定決心要的話,我就要先搬家了呢,好猶豫…剛好朋友請我來記錄一下牠跟愛貓的日常,我決定把握機會實際體驗看看再做決定!因為他家愛貓貴妃比較害羞,遇到陌生人會躲起來,好再看過我幾次,雖然不會輕易靠近但至少不會太警惕,看來我是最佳人選呢。 到他家後先拍攝
首先要安裝vscode : Visual Studio Code - Code Editing. Redefined 安裝後我們就可以把她打開來,接著去檔案 -> 喜好設定 -> 設定檔(預設) -> 你就會看到設定裡面的 settings.json,就可以開始你的設定拉(主要是依照個人的喜好設定
Thumbnail
理解一個全新的操作環境有時候可能是一個挑戰,尤其對於那些剛開始接觸VS Code的開發者來說,即便具備一定的英文閱讀能力,可能也會對這個陌生的操作環境感到徬徨和不安。不過,沒有必要擔心,我們接下來就來一起用短短的一分鐘時間,將VS Code轉換成最熟悉的中文環境吧! 安裝繁體中文語言包 由於VS
Thumbnail
今天來了一個熱心的小夥伴,想跟家裡貓咪做溝通。 貓咪1號是一隻比較怕生的貓咪,小夥伴從外面收編了四個月,始終無法跟貓咪更親近。 我們溝通完,發現牠警戒心很高,比較想擁有自己獨立小房間。 小夥伴說有點難度,於是我們就提供他另外一個方法,請他把有自己味道的衣服放在籠子裡,讓貓咪習慣味道。 再
Thumbnail
CatHelper是我開發的前端 SideProject,是貓咪募資收養的一站式平台。 我用戶使用流程、資料庫、頁面來構思這個專案。