mac 技能- 终端(oh-my-zsh)终极美化及必备插件推荐

Python016

mac 技能- 终端(oh-my-zsh)终极美化及必备插件推荐,第1张

如果你使用Mac进行开发,那么Terminal.app应该是你使用非常频繁的app了。初体验Terminal时你可能觉得单调乏味,阅读密密麻麻的内容也很费劲。但是如果你跟着我一起配置它,就会发现你平时觉得繁琐,不方便的地方其实都可以被完美解决,并且颜值也高了许多。

我们准备这样改造Terminal

修改Terminal的Profile: 让Terminal配色更美观

安装oh-my-zsh: 将Terminal的shell从bash改成更强大的zsh

安装oh-my-zsh主题: 美化oh-my-zsh

安装oh-my-zsh必备插件: 让Terminal具有更高级和便利的功能

准备工作

建议先安装homebrew, 方便后续工具安装:

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

修改Terminal Profile 主题设置

在GitHub的 osx-terminal-theme 项目主页里寻找你喜欢的主题

在schemes目录里找到对应的主题文件并双击安装到Terminal, 设置为默认

安装oh-my-zsh

先安装zsh:

brew install zsh

再安装oh-my-zsh:

sh -c"$(curl -fsSL https://raw.github.com/robbyrussell/oh-my-zsh/master/tools/install.sh)"

安装oh-my-zsh主题

内置主题列表

oh-my-zsh提供一批内置主题,可以直接设置使用

在内置主题列表寻找你你喜欢的主题:  https://github.com/robbyrussell/oh-my-zsh/wiki/Themes

在~/.zshrc配置文件里设置ZSH_THEME为你的主题名称

激活设置source ~/.zshrc

第三方主题列表

许多第三方也开发了供oh-my-zsh使用的主题,可以去第三方主题列表查看和安装:

https://github.com/robbyrussell/oh-my-zsh/wiki/External-themes

安装oh-my-zsh必备插件

oh-my-zsh有非常丰富的插件可供使用,下面列举一些必备插件,可以大幅提高生产力。

示例如下:

# ~/.zshrc:plugins=(git  zsh-syntax-highlighting)

git

自带插件,可以使用缩写命令, 比如 gaa -> git add --all, 通过alias | grep git查看所有支持缩写命令

激活: 添加到~/.zshrc的plugins列表

extract

自带插件,不用再使用复杂的tar来解压压缩包了

激活: 添加到~/.zshrc的plugins列表

autojump

使用j命令直接快速进入某个目录, 比如 j Downloads -> cd ~/Downloads

安装: brew install autojump

安装完按照提示在~/.zshrc配置文件添加:

[-f /usr/local/etc/profile.d/autojump.sh]&&. /usr/local/etc/profile.d/autojump.sh

zsh-syntax-highlighting

命令高亮插件,命令不再只是同一个颜色了

安装: brew install zsh-syntax-highlighting

添加 zsh-syntax-highlighting到~/.zshtcplugins列表。

其他安装方法参考:  https://github.com/zsh-users/zsh-syntax-highlighting/blob/master/INSTALL.md

zsh-autosuggestions

输入时按右方向键→自动补全命令

安装: brew install zsh-autosuggestions

安装完按照提示在~/.zshrc配置文件添加:

source/usr/local/share/zsh-autosuggestions/zsh-autosuggestions.zsh

编译主题

Ext

JS应用程序的主题使用的是SASS,它是一种动态编写CSS代码的方法。例如,可以在样式表中使用变量和运算。浏览器并不了解SASS,它只知道CSS,隐藏,这些SASS主题需要被编译为浏览器能理解的,生产用的CSS代码。在Ext

JS应用程序中可以通过在Sencha Cmd运行以下命令来编译主题:

sencha app build [development]

sencha app watch [toolkit]

两者的区别在于watch会通过轮询来了解更新,并理解进行编译,而build编译只能手动执行一次。

在旧版本的Ext JS或Sencha Touch,SASS样式是在Ruby中编译的。在Windows,需要使用管理员权限来安装Ruby。一旦安装完成,就可以开始编译主题了。不过,在有大量代码库和高级主题的时候,就要花费大量的编译时间。

为了编译高级主题,有时候需要花费一分钟。然后,你不得不刷新浏览器窗口来测试主题以确保已正确设置SASS变量。之后还要一次次的重复此过程。要知道,这个过程是相当耗时间的。这也是为什么对Fashion感到高兴的原因。

Sencha Fashion是使用javascript来编译主题的,可以说这是超级的快。当在左边的显示器修改一行代码后,就可以右边的显示器看到变化了,就是这么快。不再需要等等编译(在服务器开始),也不再需要刷新浏览器窗口。

由于Fashion使用的是javascript,因而有更多优点。例如,可以在Fashion之上进行扩展并创建自己的样式功能(类似SASS功能),还能调试样式表代码。

不过,最大的得益还是可以在开发机器上设计主题。要实现这个,只需要在命令行运行sencha app watch并在URL中添加以下参数:

?platformTags=fashion:true

开始编译

下面来尝试下使用Fashion来编译一个主题。首先,下载Ext JS 6。这已经包含了SDK。还需要下载Sencha Cmd 6。

安装好命令行工具后,在机器上解压Ext JS 6框架包(zip)。打开命令行提示符并通过命令行导航到框架文件夹。在Ext6文件夹,输入以下命令来创建第一个sencha通用应用程序:

ext>sencha generate app MyApp ../指定的项目路径

在IDE或编辑器中打开新的应用程序项目。要注意classic和modern这两个新的文件夹。这是用来区分工具包的文件夹。共享代码要放在app文件夹内。classic工具包文件夹包含了旧版本(桌面)视图,而modern工具包文件夹则包含了现代touch的视图。对于两个工具包来说,DOM是不同的,因而样式也会有些许不同。这也是为什么工具包文件夹会有一个src子文件夹用来放置javascript代码,会有一个sass文件夹来放置指定的样式的原因。

打开app.json文件并滚动到“builds”配置:

"builds": {

"classic": {

"toolkit": "classic",

"theme": "theme-triton"

},

"modern": {

"toolkit": "modern",

"theme": "theme-neptune"

}

},12345678910111234567891011

要注意这里的每一个build配置,他们都有自己的工具包和主题。对于classic配置,将使用新的海卫一(Triton)主题,而modern工具包将使用海王星(Neptune)主题(原名是Sencha Touch默认主题)。

现在不需要对这个进行修改。下面来创建两个新文件:

classic/sass/var/Application.scss

modern/sass/var/Application.scss

现在,打开Sencha本地Web服务器,并让Sencha轮询样式表的改变。

在通用应用程序的文件夹中,运行以下命令:

项目文件夹>sencha app watch classic

如果Cmd安装正确,该命令会正确运行。现在内置的sencha服务器将等待更新。应用程序默认可通过http://localhost:1841来访问。