一、Mac 基礎技巧
1 Mac 常用快捷鍵
// 訪達
Command + Shift + 3 // 截取全屏到桌面
Command + Shift + 4 // 截取所選區域到桌面
Command + Shift + N // 新建檔案夾
Command + Shift + . // 顯示/隱藏 隱藏檔案
Command + Shift + G // 調出視窗,可輸入絕對路徑直達檔案夾
Command + C // 復制檔案
Command + V // 粘貼檔案
Command + Option + V // 剪切檔案,需要先復制檔案
Command + Option + C // 復制選中檔案的路徑
// 瀏覽器
Command + L // 游標直接跳至地址欄
Command + T // 打開一個新標簽頁
Command + 數字鍵 N // 切換到第 N 個標簽頁
Command + '+-' // 放大/縮小頁面
Command + 左右箭頭 // 回傳上一頁或者下一頁
Control + Tab // 轉向下一個標簽頁
Control + Shift + Tab // 轉向上一個標簽頁
// 應用程式
Command + H // 隱藏非全屏的應用程式
Command + W // 關閉當前應用視窗
Command + Q // 完全退出當前應用
Command + N // 新建當前應用視窗
Command + , // 打開當前應用的偏好設定
Command + 空格 // 打開聚焦搜索
Command + Option + esc // 打開強制退出的視窗
Command + control + F // 應用全屏
Command + control + 空格 // 打開表情符號選擇界面
// 其他
Command + control + Q // 鎖定螢屏
option + 空格 // 打開你安裝的 UTools
更多快捷鍵 參考
2 觸發角
有時需要快速打開啟動臺、調度中心、應用程式視窗,可以使用快捷鍵做到,也可以設為 mac 的觸發角動作,打開系統偏好設定-桌面與螢屏保護程式-螢屏保護程式-觸發角,就可以設定觸發角動作,比如左上角滑鼠劃過就打開控制臺,右下角劃過就鎖定螢屏,非常便捷,
二、Mac 前端開發環境搭建
1 基本配置
1.1 Git
Git 是一個開源的分布式版本控制系統,可以有效、高速地處理從很小到非常大的專案版本管理,
(1)安裝 Git
- 官網下載
- 通過brew命令安裝:
brew install git
(2)配置基礎資訊和 SSH
- 設定 username 和 email
git config --global user.name "username"
git config --global user.email "email"
- 生成密鑰
// 首先檢查電腦是否曾經生成過秘鑰
cd ~/.ssh // 若打開該檔案夾為空,則表示沒有生成過秘鑰,進入第二步,(~表示根目錄)
// 生成密鑰
ssh -keygen -t rsa -C "[email protected]"
// 接著默認一直回車
// 執行成功后,會在主目錄 .ssh 路徑下生成兩個檔案: id_rsa 私鑰檔案、id_rsa.pub 公鑰檔案,
// 檢查SSH是否生成成功
cat ~/.ssh/id_rsa.pub
// 將上述結果復制到 github - settings - SSH and GPG keys - New SSH key 即可
// 驗證是否成功
ssh -T [email protected]
1.2 Node + nvm
(1)nvm
Node Version Manager(nvm)是node 版本管理工具,使用 nvm 已經是 Nodejs 開發者必備的工具,它最大的用途在于可以輕松切換不同版本的 Nodejs,幫助團隊統一開發環境,避免版本問題引發的錯誤,
a. 卸載 node
若電腦已經安裝 node ,需要卸載掉,檢查是否安裝 node,
node -v
如果有版本回傳,說明電腦已經安裝 node,此時需要把 node 卸載掉,若未安裝 node 忽略以下操作,
// 依次執行
sudo npm uninstall npm -g
sudo rm -rf /usr/local/lib/node /usr/local/lib/node_modules /var/db/receipts/org.nodejs.*
sudo rm -rf /usr/local/include/node /Users/$USER/.npm
sudo rm /usr/local/bin/node
sudo rm /usr/local/share/man/man1/node.1
sudo rm /usr/local/lib/dtrace/node.d
// 驗證是否卸載完成
node -v
npm -v
或者手動洗掉
- NODE_MODULES or NODE 檔案夾(位于您的 /usr/local/lib)
- NODE-GYP 檔案夾(位于您的 /usr/local/bin)
- NODE 檔案夾(位于您的 /usr/local/bin)
- NODE-DEBUG 檔案夾(位于您的 /usr/local/bin)
- NODE 檔案夾(位于您的 /usr/local/include)
- NODE_MODULES 檔案夾(位于您的 /usr/local/include)
- NPM (位于您的主目錄中)
- NODE-GYP (位于您的主目錄中)
- NODE 檔案夾(位于您的 /opt/local/include)
- NODE 檔案夾(位于您的 /opt/local/bin/)
- NODE 檔案夾(位于您的 /usr/local/share/doc/)
- NODE_MODULES 檔案夾(位于您的 /opt/local/lib/)
- NODE_REPL_HISTORY (位于您的主目錄中)
- STP (位于您的 /usr/local/share/systemtap/tapset/)
- D (位于您的 /usr/local/lib/dtrace/)
- NPM* (位于您的 /usr/local/share/man/man1)
- NODE* (位于您的 /usr/local/share/man/man1)
- .NPMRC (位于您的主目錄中)——如果您想在卸載后立即重新安裝 Node.js ,則不應洗掉該檔案,
b. 安裝 git
c. 安裝 nvm
打開 鏈接 :在下面的簡介中找到 install 這幾個字,然后繼續往下找,直到找到
復制箭頭所指的字到終端執行會就安裝 nvm
注意:安裝完成后,還暫時不能用,需要復制它提示的代碼來配置環境變數,如:
// 編輯 .zshrc
vim .zshrc
// 再最后加入
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion" # This loads nvm bash_completion
// 使其生效
source ~/.zshrc
最后進行測驗:nvm
d. nvm 常用指令
nvm version 查看當前的版本
nvm install 安裝最新版本 nvm
nvm install <version> 安裝相應版本
nvm use <version> 切換使用指定的版本 node
nvm ls 列出所有版本
nvm current顯示當前版本
nvm uninstall <version> 卸載制定的版本
(2)nvm 和 n 的比較
n:全域安裝的 npm package,使用 npm install -g n 安裝,與 node 回圈依賴,
n 命令是作為一個 node 的模塊而存在,而 nvm 是一個獨立于 node/npm 的外部 shell 腳本,因此 n 命令相比 nvm 更加局限,
由于 npm 安裝的模塊路徑均為 /usr/local/lib/node_modules ,當使用 n 切換不同的 node 版本時,實際上會共用全域的 node/npm 目錄, 因此不能很好的滿足按不同 node 版本使用不同全域 node 模塊的需求,
(3)node
Nodejs 是一個基于 Chrome V8 引擎的 JavaScript 運行環境,它使用一個事件驅動、非阻塞 I/O 的模型,使其輕量且高效,Nodejs 的軟體包生態系統 npm 是全球最大的開源庫生態系統,
a. 下載 Nodejs
- 官網下載
- 用 nvm 下載:
nvm install <version>
安裝完成后可以在終端輸入 node -v 和 npm - v 驗證是否安裝成功
b. 設定 npm 淘寶鏡像源
// 設定
npm config set registry https://registry.npm.taobao.org
// 驗證
npm config list
1.3 編輯器
- Sublime Text
- PhpStorm
- Visual Studio Code
- Atom
本人選擇 vscode ??
1.4 Chrome
Chrome 瀏覽器是前端開發必不可少的軟體,除此之外還有 Firefox 和 Safari 瀏覽器同樣重要,
- 下載地址
2 進階配置
2.1 iterm2
(1)問題
Mac 支持原生 Shell,其自帶的 Terminal 終端存在一定的缺陷(淺喻:ie ),
(2)作用
iterm2 是一款功能強大的命令列應用/終端工具,通常用于替代 Terminal,
- 選中即復制,無需 command + c
- 全文查找并高亮顯示:command + f
- 垂直分屏:command + d
- 水平分屏:command + shift + d
- 等等
(3)相關鏈接
- 下載地址
- 官方檔案
2.2 zsh & oh-my-zsh
(1)作用
zsh 是 shell 語言型別,兼容 bash,提供強大的命令列功能,但是配置復雜,
而 oh-my-zsh 是一個開源的框架,用于管理和簡化 zsh 配置,
(2)相關鏈接
- 下載地址
- 【操作】item2 + oh-my-zsh 終端配置
2.3 Homebrew(brew)
(1)作用
Homebrew 是基于 OS X 的套件管理工具,是一個開源的 Ruby 腳本,專門用于快速下載軟體,更通俗地講,Homebrew 類似于一個軟體中心,可以理解成 App Store 或者 Google Play 那樣的軟體商店,只不過 Homebrew 比前者以及 Mac App Store 來說有著更豐富的資源與更高效的管理,
Homebrew Cask 是一套建立在 Homebrew 基礎之上的 OS X 軟體安裝命令列工具,是 Homebrew 的擴展,可以把 Homebrew Cask 當作是 Homebrew 的一部分,在安裝常用軟體的程序中,大部分情況下只需要使用 Homebrew Cask 就足夠了,
(2)安裝
ruby -e "$(curl -fsSL https://cdn.jsdelivr.net/gh/ineo6/homebrew-install/install)"
(3)對比
brew 主要用來下載一些不帶界面的命令列下的工具和第三方庫來進行二次開發
brew cask 主要用來下載一些帶界面的應用軟體,下載好后會自動安裝,并能在 mac 中直接運行使用
// 舉例
brew install curl 可以安裝 curl 第三方庫,這樣你在開發時就可以使用它的庫來進行開發
brew cask install chrome 可以安裝谷歌瀏覽器應用程式,可直接運行
2.4 tmux
(1)問題
一般情況下,當你需要在遠程服務器上同時進行多項任務,我們可以在命令后面加上&來同時運行多條命令,但是當你想要同時監視每個任務的時候,這就不可行了,又或者可以開多個視窗,來分別執行任務,但是對于不同的視窗,還需要重新 SSH 連接到遠程服務器,大大降低了作業效率,當你桌面上視窗太多的時候,也可能會在找哪個視窗進行哪個任務上浪費大量時間,
(2)作用
tmux 是一個開源且功能非常強大的終端多路復用器,用于類 Unix 作業系統,
- 允許在單個視窗中同時訪問多個會話
- 可以讓新視窗“接入”已經存在的會話
- 允許每個會話有多個連接視窗
- 支持視窗任意的垂直和水平拆分
(3)概念關系
Server:是整個 tmux 的后臺服務
Session:是 tmux 的所有會話
Window:相當于一個作業區,包含很多分屏
Pane: Window 里面的小分屏
(4)相關鏈接
- 【教程】Tmux 使用教程
- 【教程】Tmux 使用手則
2.5 dotfile
(1)作用
dotfiles 是以 . 為前綴的檔案的統稱,在 Mac OS X 或 Linux 這類系統中,在作業環境中這類檔案是作為隱藏檔案展示的,無法看到(如: .vimrc.bashrc.bash_profile 等),它們通常用來存盤一些個人化的設定或是自定的拓展功能,以符合使用者本身的實用需求與習慣,從而提升自身的作業效率,dotfiles 一般用于軟體設定,可以通過備份 dotfiles 的方式來同步軟體設定,
(2)相關鏈接
*【教程】dotfiles 新手教程
2.6 mackup
(1)作用
Mackup 是 Github 上的開源專案,旨在快速方便地備份恢復軟體的組態檔,
(2)使用
// 安裝 Mackup
brew install mackup
// 設定同步檔案夾
vim ~/.mackup.cfg # 進行配置
[storage]
engine = file_system # 表示用檔案系統進行存盤
// Mackup操作
mackup backup # 備份命令
mackup restore # 資料恢復
mackup list # 查看支持的軟體串列
makeup -h # 幫助命令
mackup uninstall # 將組態檔拷回原來的系統目錄
(3)相關鏈接
- 【教程】使用 Mackup 快速備份 Mac 軟體的組態檔
2.7 ncu
(1)問題
npm update,只能按照 package.json 中標注的版本號進行更新,升級后不會修改 package.json 中的版本號,需要自己手動修改,比較麻煩,
(2)作用
npm-check-updates(ncu)是 npm 模塊升級工具,可以在插件升級后會自動修改 package.json 里的版本號,簡單方便,
(3)相關鏈接
- 官方網址
- 【教程】白話版 ncu 使用手則
2.8 xcode command line tools
(1)問題
Xcode 是在命令列上運行的軟體開發人員的工具,即在終端應用程式(也稱為控制臺)中運行,開箱即用的 Mac 并不包含編程所需的所有軟體和工具,相反,Apple 為程式員提供了一個名為 Xcode 的完整開發環境,可以單獨下載和安裝,完整的 Xcode 包很大,需要超過 40 GB 的磁盤空間,并且支持所有 Apple 作業系統的開發,
許多軟體開發人員,尤其是 Web 應用程式開發人員,都在使用 Mac,但并未為 Apple 設備開發軟體,他們仍然需要與 Xcode 包一起安裝的類 Unix 工具和實用程式,
(2)作用
xcode command line tools 是 Apple 針對上述問題提供了一個單獨的、更小的下載,它安裝了軟體開發最需要的實用程式,我們可以從終端應用程式安裝這個較小的包,或者作為安裝 Homebrew 的一部分,
(3)相關鏈接
- 官方網址
2.9 adb
(1)作用
Android Debug Bridge(adb),翻譯過來叫安卓除錯橋,顧名思義就是連接 Android 設備和電腦的工具, Android 平臺的一些功能只能通過對普通用戶隱藏的路徑和方法來訪問,這些通常是在一些命令列 adb 命令的幫助下完成的,這是 Google 為開發人員提供的一種工具, Android 除錯橋 (adb) 是一種功能多樣的命令列工具,可讓您與設備進行通信, adb 命令可用于執行各種設備操作(例如安裝和除錯應用),并提供對 Unix shell(可用來在設備上運行各種命令)的訪問權限,我們也可以將其用于各種整潔和隱藏的技巧,
(2)adb 組成
客戶端:用于發送命令,客戶端在開發機器上運行,可以通過發出 adb 命令從命令列終端呼叫客戶端,
守護程式(adbd):用于在設備上運行命令,守護程式在每個設備上作為后臺行程運行,
服務器:用于管理客戶端與守護程式之間的通信,服務器在開發機器上作為后臺行程運行,
(3)相關鏈接
- 官方網站
- 【教程】Mac 系統下 adb 入門
- 【教程】adb 常用命令
三、Mac 開發環境搭建程序遇到的問題
1 git 生成密鑰使用報錯
現象:The authenticity of host 'github.com' can't be established.
原因:少了一個 known_hosts 檔案,本來密鑰檔案應該是三個,現在是兩個,于是報錯,此時選擇 yes 回車之后即可,同時生成了缺少了的 known_hosts 檔案,
Are you sure you want to continue connecting (yes/no)? //輸入 yes ,回車
2 nvm 安裝成功但 nvm 命令沒反應
現象:在控制臺輸入 nvm 有結果但無法執行 nvm 的命令
原因:配置 clashx 后只是系統代理而不是終端
解決方法:進行終端代理
- 在終端輸入: vim .bash_profile
- 按“i”進入編輯模式,填寫
function proxy_on() {
export no_proxy="localhost,127.0.0.1,localaddress,.localdomain.com"
export http_proxy="http://127.0.0.1:7890"
export https_proxy=$http_proxy
#export all_proxy=socks5://127.0.0.1:7890 # or this line
echo -e "已開啟代理"
}
function proxy_off(){
unset http_proxy
unset https_proxy
echo -e "已關閉代理"
}
- 按“esc”退出編輯模式,“shift+zz”保存退出
- 在終端輸入命令使其生效
source .bash_profile
- 開啟/關閉代理
proxy_on
proxy_off
3 代理導致 vscode 拓展安裝出錯
現象:在下載 vscode 拓展插件時顯示“安裝XXX拓展時出錯,有關更多詳細資訊,請查看日志,請嘗試手動下載”
原因:電腦開了代理軟體,只要把代理關掉就可以正常下載 vscode 插件,
4 iterm2 權限問題引起的 node 配置發生錯誤
現象:在 iterm2 進行 node 配置時出現錯誤: Error: EPERM: operation not permitted, scandir '/Users/xxx/.Trash'
原因:iterm2 權限不夠
解決方法:“系統偏好設定”--“安全與隱私”--“隱私”
- “檔案和檔案夾”授予權限
- 打開“完全磁盤訪問權限”
5 Mac 每次重啟都需要重新執行組態檔
現象:每次開啟終端都要執行 source ~/.bash_profile 配置的環境變數才生效
原因:zsh 加載的是 ~/.zshrc 檔案,而 ‘.zshrc’ 檔案中并沒有定義任務環境變數,
解決方法:在 ~/.zshrc 檔案最后增加
source ~/.bash_profile
轉載請註明出處,本文鏈接:https://www.uj5u.com/qita/502482.html
標籤:其他
