前端開發環境建立

發表於 | |

前言

在開始開發之前，要先把環境先設定好，而每換一個工作環境就要重新安裝一遍。把它記錄下來，以後每次換環境都可以無痛設定了。
這裡介紹的都是在 OS X 開發環境的建立。並沒有歧視其他系統的開發者，只是因為筆者我目前使用的是 OS X 系統。
以下是會安裝到的東西：

  • oh-my-zsh
  • git
  • nvm
  • node, npm

oh-my-zsh

安裝 Homebrew

Homebrew 是 Mac OSX 上的的套件管理工具。

1
2
3
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
# 確認是否有安裝成功
brew --version

接著安裝 iTerm2, ZSH, Oh My ZSH
詳細步驟請參考 PJChen 寫的這篇超級清楚的安裝教學:
https://pjchender.blogspot.tw/2017/02/mac-terminal-iterm-2-oh-my-zsh.html。

Git

直接安裝 xcode 就會自動安裝 git 了，以後在測試的時候，也可以使用 xcode 來測試 APP 在 ios 上的呈現。

NVM

如果先前有在全域安裝過 node，要先删除下已安装的 node 和全局 node 模块。

1
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh | bash

確認一下是否有安裝完成

1
2
command -v nvm
# 如果有正常安裝，會回傳 nvm

安裝目前穩定的 node 版本

1
nvm install stable

如果想要指定安裝的版本，請查閱下面的其他指令說明。

使用 nvm 來管理包的話，要在全域安裝的時候也不用加上 sudo，直接使用 npm -g 就可以了。
想當初我還一直懷疑我的 mac 為什麼都不用加 sudo 恐慌了一下。

NVM 指令

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
# 安裝目前最新的 node 版本
nvm install node 

# 安裝穩定版本的 node
nvm install stable

# 安裝指定的版本
nvm install <version>

# 在任何新的 shell 使用所安裝的最新的 node
nvm use node 

# 使用指定的 node 版本
nvm use <version> 

# 解除安裝指定版本
nvm uninstall <version> 

# 安裝新版 node 並安裝之前版本安裝過的 npm package 
nvm install node --reinstall-packages-from=node
nvm install v10.1.0 --reinstall-packages-from=4.2
1
2
3
4
5
6
7
8
9
10
11
12
13
14
# 列出本機已安裝的 node 版本
nvm ls

# 列出所有可安裝的 node 版本
nvm ls-remote

# 查詢目前 node 版本
nvm current

# 查尋指定版本的 node 安裝路徑
nvm which <version>

# 查看 nvm 版本
nvm --version

以可以用 nvm --help 來查詢其他可用的指令。

參考資料