前端开发环境的搭建
环境搭建
发布于 2017-12-24
本开发环境是自己在工作中的环境,为了方便以后更换开发设备。留个笔记,顺便分享出来。
安装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用户组里
- 安装docker后通常是有docker用户组,如果没有就新建用户组
sudo groupadd docker - 将当前用户加到docker组里
sudo gpasswd -a ${USER} docker - 重启docker服务
sudo service docker restart - 新建一个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更快。