前端同学Windows中生存指北

本文仅针对没有 Mac 且因为一些限制无法装 Linux 的前端同学,对 windows 同样感到不适的写其他脚本语言的同学亦可参考。

我个人常用的开发工具是

  • Vim
  • 浏览器
  • Git
  • Node

我之前一直在用 Linux 做开发,突然换到 Windows 至今还是有点懵逼。公司 IT 部门也不提供 Linux 支持,Hi 是无解的,并且内网准入啊远程桌面啊感觉都是很折腾的事情,打消了我装 Linux 的想法。虽然 Windows 下有 Git 自带的 Bash 模拟器,但是太卡,用起来不爽,并且对多任务很不友好,一开一串窗口,最奇葩的是 Ctrl+D / Ctrl+C 竟然不能杀掉当前进程(当然也可能和操作系统有关),总之问题比较多,影响开发体验。所以由于我使用的开发工具基本没有平台依赖性,所以想了个折中的方法:虚拟机。

我选用的发行版是 CentOS7 Minimal,跑起来不太占内存和 CPU,比较友好。接下来要介绍的就是虚拟机食用方法:

  • 共享文件夹挂载
  • 端口转发
  • Tmux
  • CentOS7 特别篇(介绍了一些CentOS7的小坑,如果你装的不是 CentOS7可以不看)

当然,如果你有 Mac,当我没说T_T

共享文件夹挂载

这一步是非常重要的一步,如果无法成功挂载就不用看下面的步骤了……因为只有挂载上才能愉快地在本地写码。

  1. 安装kernel-devel kernel-headers gcc gcc-c++ makeupdate 后重启

  2. 执行 #ln -s /usr/src/kernels/<内核版本号> /usr/src/linux

  3. 设置一个环境变量

    #vim /etc/profile
    # 写入下面的内容,这里也有可能是 KERN_VER
    KERN_DIR=/usr/src/kernels/<内核版本号>
    export KERN_DIR
    # 重新加载环境配置
    #source /etc/profile
    
  4. 下载 VBoxGuestAdditions 至虚拟机并挂载到某目录,进入该目录,sh ./VBoxLinuxAdditions.run,最后一行输出 Virtualbox Guest Additions: Starting 说明安装成功

设备 -> 共享文件夹 设置共享文件夹,使用 df 命令可以查看共享文件夹挂载位置,我的是挂载在 /media 下。

踩坑小达人上线

由于一些 npm 包在安装时会创建软连接到安装目录,而 VirtualBox 从安全角度出发,限制了软链接的创建,所以这里需要打开相应的 feature。

  1. 关闭 VirtualBox

  2. 将VirtualBox安装目录的路径加入系统环境变量PATH中

  3. 打开 CMD,执行如下命令:

    VBoxManage setextradata <虚拟机名称> VBoxInternal2/SharedFoldersEnableSymlinksCreate/<共享文件夹名称(没有 sf_ 前缀)> 1
    
  4. 以管理员身份运行虚拟机

端口转发

端口转发是将虚拟机某个端口映射到本地某个端口,相当于虚拟机网关开了个洞,打通了虚拟机内外网。有了端口转发就可以在本地调试虚拟机上的代码啦!

这里以 VirtualBox 为例。

打开目标虚拟机的设置,选择网络选项卡,点击正在使用的那个网卡(一般就是网卡一),连接方式选择网络地址转换(NAT),这样虚拟机内网成为了宿主机的一个子网,虚拟机便可以直接通过宿主机上网啦。

然后点击高级,选择端口转发,这里举个例子,我们可以设置将虚拟机 22 端口映射到本地 2222 端口,协议选择 tcp,这样就可以使用 ssh 到 127.0.0.1:2222来访问虚拟机了。

同理,当我们在虚拟机启动项目时,可以将项目开放的端口映射到本地,这样就可以在本地浏览器进行调试了。不过要注意的一点是,要关闭虚拟机的防火墙或设置防火墙放通该端口。

webpack-dev-server 特别篇!

webpack-dev-server 应该是非常常用的热加载工具,在文中所述场景下使用时会出现一些问题。

  1. 它启动时是默认将 localhost 作为 host,即只能通过本地回环访问,所以要加一个启动项 --host 0.0.0.0 广播到局域网,这样就可以在宿主机正常访问了。
  2. 在宿主机上通过共享文件夹对代码进行更新时不会检测到文件变更,以至于不会触发编译。至于原因我也不知道为啥。官方文档给出了一个 解决方法,增加启动项--watch-poll,可以起作用,至于原因我也不知道为啥。

Tmux

欢迎进入大幅度提升开发体验的部分!

tmux 是个控制台模拟器,通俗来讲是可以让你在一个 session 中打开多个控制台。比如你使用 powershell ssh 到了远程服务器做了一些工作,此时想再开个控制台做另外一些工作,可能就要再开个 session,比较蛋疼,而有了 tmux,你就可以在这一个 session 中开启多个 pane 甚至 window。

那么既然 tmux 这么棒,为什么不见大家用呢?因为快捷键比较复杂……学习成本高大家不愿意学……

但是作为一名 Vim 用户,我早就被各种快捷键做过大保健了,所以学习起来困难不是太大……在这里讲下入门小知识,并整理几个常用配置和快捷键,帮助大家快速入门。

tmux 快捷键在使用时需要加一个前缀,相当于一个命名空间。这个前缀默认是 Ctrl b,可以根据自己的喜好进行设置。

设置前缀

在家目录下新建文件 .tmux.conf ,写入如下内容

#设置前缀为Ctrl + a,这里根据喜好设置
set -g prefix C-a
#解除Ctrl+b 与前缀的对应关系
unbind C-b

然后执行source-file ~/.tmux.conf重新加载配置文件。

常用快捷键

Pane 相关

  • 键盘上下左右 将光标移动到上/下/左/右方的 pane
  • % 垂直分割
  • “ 水平分割
  • x kill掉
  • z toggle
  • { 移动当前 pane 到左侧
  • } 移动当前 pane 到右侧

Window 相关

  • c 新建
  • n 移动到下一个
  • p 移动到上一个

其他还有一些很必要的快捷键,不过吃胖也要慢慢来,等你发现 tmux 的好用时便会自动去寻找你需要的快捷键。

其他

假如你本地的终端模拟器(比如 powershell)在使用过程中意外崩溃,前一刻你的终端里还有若干份正在修改的代码、一个正在奔跑的服务、好几个打开的 log,此时你的心情一定也非常崩溃。但是如果你恰巧使用了tmux,那么这个 session 是不会丢失的(和通过 powershell 打开的不是一个 session),再次登录时可以使用下面的命令直接恢复:

# 查看 session 列表,找到那个 session 编号
tmux ls
# 恢复指定 session
tmux at -t <session number>

当然,如果是虚拟机崩溃了就没辙了……(逃

CentOS7 特别篇

联网

CentOS7 Minimal 是默认关闭网卡的。现在需要打开它。

执行cd /etc/sysconfig/network-scripts/ && ls查看该目录下文件,执行vi ifcfg-*打开第一个文件(由于第一个文件的文件名有可能是不同的所以使用ifcfg-*来表示) 将最后一行 ONBOOT=no 改为ONBOOT=yes,保存,执行service network restart重启网络服务。

换源

以更换为 163 的源为例。

#安装 wget
sudo yum install wget
#下载 163 的源
wget http://mirrors.163.com/.help/CentOS7-Base-163.repo
#备份系统自带的源并且替换为163源
cp CentOS7-Base-163.repo /etc/yum.repos.d/ && cd /etc/yum.repos.d && mv CentOS-Base.repo CentOS-Base.repo.bk && mv CentOS7-Base-163.repo CentOS-Base.repo
#更新yum源
yum makecache
posted @ 2017-11-09 11:31  Sevenskey  阅读(...)  评论(...编辑  收藏