前端開發環境的搭建

本開發環境是本身在工做中的環境，爲了方便之後更換開發設備。留個筆記，順便分享出來。

安裝homebrew

做爲mac上的第三方包管理器，有了它安裝wget等會十分方便。

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

安裝nvm，並以此安裝node

衆所周知，node徹底是一個版本帝。因此就有了node version manager。此組件不建議使用homebrew安裝。

• 經過curl下載並寫到bash配置裏

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

• 設置nvm代理

在對應的家目錄下腳本配置裏的最後寫上

export NVM_NODEJS_ORG_MIRROR=http://npm.taobao.org/mirrors/node

• 將寫入的配置在當前的環境執行

source ~/.zshrc

vagrant下載配置

爲了模擬線上環境，下載vagrant。配置Ubuntu環境

• 在http://www.vagrantup.com 頁面下載並安裝vagrant
• 下載並安裝virtual box
• 在http://www.vagrantbox.es/ 頁面下載對應的.box文件
• 將對應的box文件放到打算開發的目錄裏，vagrant init **.box
• init以後會生成一個Vagrantfile, 將文件中對應的配置修改以下

config.vm.network "private_network", ip: "192.168.33.33" // 相對本機的靜態ip
config.vm.synced_folder "./data", "/vagrant_data" // 共享目錄

• vagrant up
• vagrant ssh

經過vagrant ssh登陸Ubuntu後的配置

• 首先配置ubuntu的阿里雲源

sudo vim /etc/apt/sources.list
# ubuntu 16.04配置以下
deb http://mirrors.aliyun.com/ubuntu/ xenial main restricted universe multiverse
deb http://mirrors.aliyun.com/ubuntu/ xenial-security main restricted universe multiverse
deb http://mirrors.aliyun.com/ubuntu/ xenial-updates main restricted universe multiverse
deb http://mirrors.aliyun.com/ubuntu/ xenial-backports main restricted universe multiverse
##測試版源
deb http://mirrors.aliyun.com/ubuntu/ xenial-proposed main restricted universe multiverse
# 源碼
deb-src http://mirrors.aliyun.com/ubuntu/ xenial main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ xenial-security main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ xenial-updates main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ xenial-backports main restricted universe multiverse
##測試版源
deb-src http://mirrors.aliyun.com/ubuntu/ xenial-proposed main restricted universe multiverse
# Canonical 合做夥伴和附加
deb http://archive.canonical.com/ubuntu/ xenial partner
deb http://extras.ubuntu.com/ubuntu/ xenial main

• 下載nginx

sudo apt-get install nginx

docker設置

• 下載docker

sudo apt-get install docker.io

• 將當前用戶加到docker用戶組裏

1. 安裝docker後一般是有docker用戶組，若是沒有就新建用戶組
sudo groupadd docker
2. 將當前用戶加到docker組裏
sudo gpasswd -a ${USER} docker
3. 重啓docker服務
sudo service docker restart
4. 新建一個shell對話，由於用戶組取的是緩存信息
command + t 嘍

• 添加docker加速源

在/etc/docker目錄下新建daemon.json，內容以下，
並將地址改成本身在https://dev.aliyun.com 中的加速連接
{

  "registry-mirrors": ["https://xxx.mirror.aliyuncs.com"]

}

• docker pull *

編輯器選擇

固然都是我的觀點。

• vue開發我的感受vscode 配合vetur 很是好用
• react開發我的感受webstorm更好用
• angular不敢多說
• 打開單文件或者經典項目，感受sublime更快。