打造高效前端工作环境 - tmux

前言

 现在前端开发可不容易啊,先打开个VIM,然后再打开个lite-server,一不小心写个ES2015还要打开个gulp来做预编译,如果能把这么多个窗口放在一个工作台上那就好了。咦,tmux不就专干这事的吗?

tmux入门

安装sudo apt install tmux

tmux的C/S架构

服务端(Server), 1个服务端维护1~N个会话;
会话(Session), 1个会话对应1~N个窗口;
窗口(Window), 1个窗口对应1~N个窗格;
窗格(Pane),vim、bash等具体任务就是在窗格中执行。

1.进入tmux
 在shell中执行tmux就会自动创建一个匿名会话、窗口和窗格,而窗格内正在运行着另一个shell程序,这时我们可以像平常使用shell一样来工作。而tmux真正的威力在于对会话、窗口和窗格的管理,但在此之前我们要先了解开启魔法的阀门——快捷键前缀(prefix)。

2.快捷键前缀(prefix)
 tmux为使自身的快捷键和其他软件的快捷键互不干扰,特意提供一个快捷键前缀,默认为Ctrl+b。因此当我们输入任何tmux快捷键前必须先输入Ctrl+b
 由于快捷键前缀是可以重置的,因此后文将以<prefix>来指代快捷键前缀。

3.操作Pane
创建(通过分割当前pane实现)
<prefix> ",水平分割当前pane
<prefix> %,垂直分割当前pane
关闭
<prefix> x,删除当前pane
跳转
<prefix> <up-arrow>/<down-arrow>/<left-arrow>/<right-arrow>, 通过上下左右方向键跳转到对应的pane
<prefix> ;,跳转到上次激活的pane
<prefix> o,跳转到下一个pane
<prefix> q,显示各pane的编号,并输入编号跳转到对应的pane
修改尺寸
<prefix>+<up-arrow>/<down-arrow>/<left-arrow>/<right-arrow>, 通过上下左右方向修改当前pane的高宽
缩放
<prefix> z,缩放当前pane
其他
<prefix> {,将当前pane移动到最左边
<prefix> },将当前pane移动到最右边
<prefix> !,将当前pane转变成window

4.操作Windoiw
创建
<prefix> c,创建window
重命名
<prefix> ,,重命名当前window
注意:由于tmux默认会根据当前pane执行的程序来改变window名称,因此需要在~/.tmux.conf中加入set-option -g allow-rename off来固化window名称。
关闭
<prefix> &,关闭当前window
跳转
<prefix> n,跳转到下一个window
<prefix> p,跳转到上一个window
<prefix> 0...9,跳转到对应的window
其他
<prefix> :swap-window -s 2 -t 1, 调转编号为2和1的两个window的次序
5.操作Session
<prefix> s,显示所有会话
<prefix> $,重命名
<prefix> d,脱离当前会话
<prefix> :kill-session,关闭当前会话
<prefix> (,跳转到上一个会话
<prefix> ),跳转到下一个会话

tmux进阶

1.细抠Session操作
 我们为前端开发环境和后端开发环境分别创建两个Session来独立管理,那么我们就可以灵活地在两个Session间穿梭,并且可以分别和前端、后端开发人员协同工作,下面我们看看相关的命令吧。
$ tmux<prefix> :new, 创建匿名Session
$ tmux new -s mysession<prefix> :new -s mysession, 创建名为mysession的Session
$ tmux kill-session -t mysession,关闭mysession会话
$ tmux kill-session -a,关闭所有会话
$ tmux ls,显示所有会话信息
$ tmux a,附加到最近一个会话
$ tmux a -t mysession,附加到会话mysession

2.多个panes输入同步
<prefix> + :setw synchronize-panes

 这个功能在通过ssh维护多台服务器时十分有用!

3.复制粘贴
 通过tmux我们可以通过纯键盘操作实现跨pane的复制粘贴。首先在~/.tmux.conf文件中添加setw -g mode-keys vi,启用vi键盘方式(hjkl方向键,/?nN搜索)操作buffer内容。
进入复制模式,<prefix> [
开始选择,<Spacebar>
选择结束并将内容复制到新的buffer,<Enter>
取消选择,<Esc>
从buffer_0粘贴到光标位置,<prefix> ]
 可见复制的内容均暂存在buffer中,而tmux也提供直接操作buffer的命令给我们.
<prefix> : show-buffer,显示buffer_0的内容
<prefix> : capture-pane, 保存当前pane的内容
<prefix> : list-buffers, 显示所有buffer内容
<prefix> : choose-buffer, 选择buffer并粘贴
<prefix> : save-buffer buf.txt, 保存buffer内容到but.txt
<prefix> : delete-buffer -b 1, 删除buffer_1的内容

4.美化状态栏
 默认的tmux样式有点丑,而https://github.com/gpakosz/.tmux这个配置则为我们提供漂亮状态栏.

总结

 尊重原创,转载请注明来自:http://www.cnblogs.com/fsjohnhuang/p/6057050.html ^_^肥仔John

打造高效前端工作环境 - tmux的更多相关文章

  1. 打造高效前端工作环境-tmuxinator

    前言  虽然tmux能让我们方便组织工作环境,但每次重新打开会话时都需要手动重新创建窗口.窗格和执行各种程序,能不能像VS那样以工程为单位保存窗口.窗格和各种所需执行的程序的信息呢?tmuxinato ...

  2. 打造高效的工作环境 – SHELL 篇

    注:本文由雷俊(Javaer/Emacser)和我一起编辑,所以文章版权归雷俊与我共同所有,转载者必需注明出处和我们两位作者.原文最早发于酷壳微信公众号,后来我又做了一些修改,再发到博客这边. 程序员 ...

  3. [转载] 高效MacBook工作环境配置

    原文: http://www.xialeizhou.com/?p=71 高效MacBook工作环境配置 发表于 2015 年 8 月 1 日 由 xialeizhou 本文记录整个配置过程,供新入手M ...

  4. [转载] 高效 MacBook 工作环境配置

    原文: http://mp.weixin.qq.com/s?__biz=MjM5NzMyMjAwMA==&mid=208231200&idx=1&sn=8a76ddc56c1f ...

  5. 高效 MacBook 工作环境配置

    转自:https://mp.weixin.qq.com/s/sloc6HgKcosXtWcbMB_5hA 工欲善其事,必先利其器,工具永远都是用来解决问题的,没必要为了工具而工具,一切工具都是为了能快 ...

  6. 高效 MacBook 工作环境配置,超实用!

    作者:正鹏 & 隃墨 http://www.xialeizhou.com/?p=71 前言 工欲善其事,必先利其器,工具永远都是用来解决问题的,没必要为了工具而工具,一切工具都是为了能快速准确 ...

  7. Android Studio 1.0.1 + Genymotion安卓模拟器打造高效安卓开发环境

    我们开发安卓大多是使用Eclipse和安卓SDK中自带的安卓模拟器.当然,Google早就推出了自己的安卓开发环境——Android studio,在不久前,Google发布了Android Stud ...

  8. 安装完CentOS 7 Minimal之后,从头打造桌面工作环境

    安装完CentOS 7 Minimal之后,从头打造桌面工作环境 U盘装CentOS 7 DVD版不能引导的解决办法 更改root密码 SSH登录 增加除root之外的常规用户 装完CentOS 7之 ...

  9. 《微信小程序项目开发实战:用WePY、mpvue、Taro打造高效的小程序》(笔记1)WePY开发环境的安装

    WePY的安装或更新都通过npm进行,全局安装或更新WePY命令行工具,使用以下命令: npm install wepy-cli -g 稍等片刻,成功安装后,即可创建WePY项目. 注意:如果npm安 ...

随机推荐

  1. django server之间通过remote user 相互调用

    首先,场景是这样的:存在两个django web应用,并且两个应用存在一定的联系.某些情况下彼此需要获取对方的数据. 但是我们的应用肯经都会有对应的鉴权机制.不会让人家随随便便就访问的对吧.好比上车要 ...

  2. 使用UIBezierPath绘制图形

    当需要画图时我们一般创建一个UIView子类, 重写其中的drawRect方法 再drawRect方法中利用UIBezierPath添加画图 UIBezierPath的使用方法: (1)创建一个Bez ...

  3. Android Studio —— 重装 HAXM

    Android Studio -- 重装 HAXM 版权声明:本文为博主原创文章,未经博主允许不得转载. 微博:厉圣杰 文中如有纰漏,欢迎大家留言指出. Android SDK 自带模拟器一直以慢.卡 ...

  4. javascript数组查重方法总结

    文章参考地址:http://blog.csdn.net/chengxuyuan20100425/article/details/8497277 题目 对下列数组去重: var arr = ['aa', ...

  5. jq选择器基础

    Jquery $代表选择器 使用jq必须要导入jq文件 <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js&qu ...

  6. MySQL 系列(一) 生产标准线上环境安装配置案例及棘手问题解决

    一.简介 MySQL是最流行的开放源码SQL数据库管理系统,它是由MySQL AB公司开发.发布并支持的.有以下特点: MySQL是一种数据库管理系统. MySQL是一种关联数据库管理系统. MySQ ...

  7. 应该是Angular2的一个bug?

    为了应对未来的趋势,及时赶上下一趟互联网技术,我最近也在通过具体项目研究angular2,首先必须要吐槽的是,学习angular2的成本本身不高,但是一堆的工具.配置实在让人 很是焦灼,就像asp.n ...

  8. 微信小程序前端源码逻辑和工作流

    看完微信小程序的前端代码真的让我热血沸腾啊,代码逻辑和设计一目了然,没有多余的东西,真的是大道至简. 废话不多说,直接分析前端代码.个人观点,难免有疏漏,仅供参考. 文件基本结构: 先看入口app.j ...

  9. [算法]——快速排序(Quick Sort)

    顾名思义,快速排序(quick sort)速度十分快,时间复杂度为O(nlogn).虽然从此角度讲,也有很多排序算法如归并排序.堆排序甚至希尔排序等,都能达到如此快速,但是快速排序使用更加广泛,以至于 ...

  10. BPM配置故事之案例4-子表

    公司渐渐对采购管理重视起来了,新招聘了采购主管老李,老李对现有的申请表很不满意,要求将申请物资和申请原因改成物资明细表 物资明细表 小明只好继续致电大毛-- 大毛:把申请物资和申请原因删掉,新增一个数 ...