iT邦幫忙

1

老師!我想知道!要怎麼讓終端機變漂亮呢 - Mac 篇

  • 分享至 

  • xImage
  •  

當我們在 Mac 底下打開終端機、或者在 VSCode 裡面看到終端機裡面的文字時,會不會想說為什麼有些大神的畫面看起來這麼繽紛好看,自己的就灰灰黑黑的,網路上有很多大神做了一些能讓大家更容易客製化自己的終端機的主題、也有很多人做過類似的教學,今天這篇文章除了寫給大家參考,也同時讓自己做個紀錄!

連更詳細的每一個文字區塊的顏色、圖標都是可以按照自己需求來客製化的哦!這次不會寫到那麼詳細的部分,但至少會讓大家的終端機不再是黑黑灰灰的!


  1. 一開始我們要先打開電腦裡的終端機,請先打開啟動台,並在裡面找到終端機,接著打開它。

  2. 打開後,會出現黑色視窗,如果沒做過什麼設定的話,它就是黑壓壓的、文字也沒有什麼色彩,這時候我們要先安裝一個叫做 homebrew 的套件管理工具,它可以讓我們很方便地在終端機裡安裝、管理套件。
    如果你不知道你是否安裝過,你可以在終端機鍵入 brew,若是出現類似 command not found 的訊息,那就是尚未安裝過喔,請依照下列指令來安裝( $ 字號不用輸入,是用來表示終端機入指令的地方)。

     $ /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install.sh)" 
    

    畫面上若顯示 Password:,就請你輸入你電腦使用者的密碼,若是出現 Press RETURN to continue or any key to abort,就按下 ENTER 鍵。

    直到畫面再度出現終端機可以打指令的地方,就是安裝好了。也可以使用指令 brew --version 來確定是否安裝完成。


  1. 接下來我們要安裝叫做 iTerm2 的終端機,它可以用來取代 Mac 原生的終端機。我們透過剛剛裝好的 homebrew 來幫我們安裝 iTerm2。

     $ brew cask install iterm2
    

    畫面可能跟我的不太一樣,但安裝成功的話,最後面會出現 ? iterm2 was successfully installed!

  2. 接著我們可以來為 iTerm2 挑選配色,請戳這裡,網頁中可以看到很多不同配色,挑選一個自己喜歡的配色,在喜歡的配色的名字按右鍵,並選擇另存連結後將檔案儲存下來。

    如果太多了選不出來,也可以跟我用一樣的配色哦,是這個「Tomorrow Night Eighties」,你也可以在這裡直接對「」裡的 Tomorrow Night Eighties 按右鍵、另存連結,將會下載一個檔案,檔名為 Tomorrow Night Eighties.itermcolor

  3. 下載好後,我們打開啟動台,並找到 iTerm2 打開它。開啟後,我們要打開 Preferences 來設定配色,可以由上方的選單列選擇 iTerm2 -> Preferences ,打開後選擇到 Colors 的標籤,在右下角的 Color Presets 打開選單,並選擇 Import。

    選擇我們剛剛下載的檔案 Tomorrow Night Eighties.itermcolor ,並且在 Color Presets 選擇剛剛匯入成功的這個主題。


後面的步驟都在 iTerm2 裡面做就好囉!可以先把醜醜的原本的終端機關掉了!

-> 從啟動台打開 iTerm2:


  1. 接著我們下載 zsh (Z Shell) ,當我們透過終端機下指令與系統核心互動,所使用的就是 Shell 指令,像是 Linux 預設使用的就是 bash ,而 MacOS 則是在 2019 年後,預設由 bash 改成了 zsh,zsh 除了包含許多 bash 的功能外,也將其他各種 Shell 的功能也納入,zsh 能讓我們使用上更方便。

    安裝指令:

     $ brew install zsh
    

    等待安裝完成後,可以使用 zsh --version 來檢查是否真的安裝成功了,會出現你所安裝的版本號,類似這樣的結果 zsh 5.7.1 (x86_64-apple-darwin19.0.0)

    安裝好後,我們要將預設使用的 Shell 改為 zsh,指令如下,如果有跳出提示 Password:,就鍵入你 Mac 的密碼:

     $ chsh -s $(which zsh)
    

    以上指令可以透過 echo $SHELL 來驗證是否成功,輸出的結果會包含 /bin/zsh,如果沒有就是不正確的結果哦!


  1. 將 zsh 設定好後,我們要安裝 oh-my-zsh ,這是一個讓我們很方便設定 zsh 的框架,透過修改 .zshrc 檔案,就可以設定主題、客製化 Prompt (像是上一張圖裡的 chrishuang@Chris ~ % 的這一串)、新增插件來讓 zsh 更方便好用等等。

    安裝指令:

     $ sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"
    

    等待安裝好後,我們就可以來修改 .zshrc 來設定 zsh 囉!

    我們先來挑選喜歡的主題,可以到底下的連結去挑選,把喜歡的主題名字複製起來,設定 .zshrc 時會用到。 oh-my-zsh 主題

    或者你也可以跟我一樣,使用其他主題,我是使用 Powerlevel9k ,一起來看看怎麼安裝吧!先使用以下指令將檔案下載到本地端:

     $ git clone https://github.com/bhilburn/powerlevel9k.git ~/.oh-my-zsh/custom/themes/powerlevel9k
    

    接著使用指令 open .zshrc 來打開設定檔,找到文字開頭為 ZSH_THEME 開頭的那一行,接著將後方"xxx" 中間的文字替換成你喜歡的主題名字,以 Powerlevel9k 來說,就是把這行替換成 ZSH_THEME=powerlevel9k/powerlevel9k

    除此之外,我們還可以設定 Prompt,以及每個部份的顏色,這些設定相關的部分可以到 powerlevel9k 的 Github 去看,其實已經出了 Powerlevel10k ,但因為自己之前使用是 Powerlevel9k,或許之後有機會再跟大家介紹新版本的使用。

    這裡直接提供我的設定,大家可以把這幾行替換掉原本的 ZSH_THEME 那一行。

    ZSH_THEME=powerlevel9k/powerlevel9k
    POWERLINE9K_MODE='nerdfont-complete'
    POWERLEVEL9K_LEFT_PROMPT_ELEMENTS=(user dir vcs dir_writable)
    POWERLEVEL9K_RIGHT_PROMPT_ELEMENTS=(status background_jobs time)
    POWERLEVEL9K_PROMPT_ADD_NEWLINE=true
    POWERLEVEL9K_DIR_HOME_BACKGROUND='211'
    POWERLEVEL9K_DIR_HOME_SUBFOLDER_BACKGROUND='211'
    POWERLEVEL9K_DIR_DEFAULT_BACKGROUND='211'
    

    最後按下 cmd + S 來儲存檔案。


  1. 設定完主題後,因為我們還沒安裝含有那些圖示的字體,有些可能會顯示不出來,因此最後我們來下載字體。
    先將字體下載到本地端:

     $ git clone https://github.com/powerline/fonts.git --depth=1
    

    等待下載完畢後,我們要開始安裝:

     $ cd fonts
     $ ./install.sh
    

    等待指令跑完後,將剛剛下載的字體清掉:

     $ cd ..
     $ rm -rf fonts
    

  1. 真的最後的最後了,我們要把終端機的字體改成剛剛下載下來的字體,一樣從上方的選單列選擇 iTerm2 -> Preferences ,打開後選擇到 Text 的標籤,接著在 Font 的地方選擇你想要的字體,我是使用 Source Code Pro for Powerline,你也可以選擇其他你喜歡的!選擇完畢後關掉這個視窗就可以了。

    接著在終端機輸入以下指令,應該就能看到終端機變得跟原本不一樣了!

     $ exec $SHELL
    

    除了顏色、字體以外,圖標也都可以正常顯示囉!


沒想到這篇文章的篇幅這麼長,之後有機會再為大家介紹在 Windows 底下的 PowerShell 要怎麼像這樣讓它也有色彩、變漂亮,還有新版的 Powerlevel10k 要怎麼使用。

如果照著步驟還是失敗的話,也歡迎留言來討論看看可能是什麼原因造成的錯誤哦!


圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 則留言

0
Sam
iT邦新手 5 級 ‧ 2020-10-23 11:30:09

謝謝分享,我的也變漂亮了/images/emoticon/emoticon35.gif

Chrissspy iT邦新手 5 級 ‧ 2020-10-23 23:29:02 檢舉

感謝留言!對我來說是很大的鼓勵!

我要留言

立即登入留言