让 Sublime Text 3 更好的为我们工作 - Sublime Text 3 使用小教程

阅读 3575
收藏 267
2016-12-21
原文链接:www.zhoujiping.com

Sublime Text 是一款代码编辑器,小巧,灵活,可安装自己需要的插件,对于编写Php, Ruby, Python, Js等动态脚本语言个人觉得是足够了,当然前端用它也肯定是够了。Sublime的官网是 www.sublimetext.com/,大家可以自行下载,它是一款付费软件,价格还不便宜,不过它也提供了永久免费的试用期,只不过会偶尔弹出让你购买的提示。

对于编写php代码, Phpstrom也是一个极佳的选择,网上有很多人将Subime和Phpstrom进行讨论,想论出个谁优谁劣的结果,其实这并没有什么意义,自己喜欢用哪个就用哪个吧,只不过Sublime类属于编辑器(Edit), 而Phpstrom是一个集成开发环境(IDE),可以说它们并不具备可比性。

如果非要做个对比的话,那对于这些脚本语言我肯定会使用Sublime, 像编写php,我觉得用Phpstrom太浪费我的电脑资源了,而编写静态语言项目,比如C#,我会选择用Visual Studio, 编写Java我会选择使用IntelliJ IDEA.

下面我们一起来看下针对编写php程序,我们如何来配置下我们的Sublime, 以下的操作的都是在Mac Os中进行的,windows系统自己研究下快捷键,应该差不多的。

美化Sublime Text 3

默认安装的Sublime的界面貌似尚未达到我们内心对美的那份追求。我们可以将界面换成比较流行的material theme, 你可以google搜索material theme,就能找到下面这个网址:
github.com/equinusocio…,里面有详细的安装教程。

这里我也把安装步骤说一下,首先我们需要给sublime text 3安装插件管理工具Package Control.io

打开sublime, 使用control + `快捷键,或者点击View > Show Console菜单,调出控制台,在其中输入以下Python代码:

import urllib.request,os,hashlib; h = 'df21e130d211cfc94d9b0905775a7c0f' + '1e3d39e33b79698005270310898eea76'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

安装完后,重启sublime即可。官方安装说明在这里,也可以自己看一下。packagecontrol.io/installatio…

在sublime中按住command + shift + p,在弹出的搜索框中搜索Package Control,在跳出的下拉框中选择Package Control:Install Package,再回车,这时候再重新跳出的搜索框中搜索:material theme,然后回车以安装。

好了,下面还要配置下,鼠标移到菜单栏Sublime Text -> Preferences > Settings在右边的窗口(user)中输入你以下配置(里面都是json格式),保存后即可:

"color_scheme": "Packages/Material Theme/schemes/Material-Theme.tmTheme",
"theme": "Material-Theme.sublime-theme",

如果你觉得Material-Theme的默认代码高亮你不喜欢,那么我们还可以再安装一个colorsublime的插件,还是先command + shift + p,在弹出的搜索框中搜索Package Control,在跳出的下拉框中选择Package Control:Install Package,再回车,这时候再重新跳出的搜索框中搜索:colorsublime,然后回车以安装。,安装。 安装完后按住command + shift + p,这时候搜索colorsublime,在弹出的下拉框中选择: Colorsublime:Install Theme```

colorsublime

之后你就可以在跳出的搜索框中查看去喜欢的高亮主题了,你按住键盘的方向键去选中这些主题,它会时时的将主题预览显示出来,比如说我们选择Facebook的主题,如下:

sublime Facebook主题

这样的方式选择高亮主题后,我们左边的边栏颜色和主题颜色不一致,下面我们再来调一下,还是先进入到Package Control:Install Package中,搜索PackageResourceViewer安装, 再command + shift + p调出搜索框,搜索并打开PackageResourceViewer:Extract Package, 然后搜索点击Material Theme.

现在我们按下图所示打开我们的sublime packages文件夹:

sublime package

我们编辑下Material-Theme文件夹中Material-Theme.sublime-theme文件中所有的layer0.tint的颜色,Mac电脑你可以安装Color picker小工具来获取颜色, 如果你不想安装这个工具,你也可以使用QQ截图工具获取16进制的RGB的颜色,然后到www.colorpicker.com 在线进行格式转化。

下面我们来更换下颜色,我们随便找到一个"layer0.tint": [38, 50, 56]的代码,选中38, 50, 56,然后使用快捷键control+command+g选中所有行的38, 50, 56, 然后输入你自己获取的颜色,比如37, 43, 57,全局替换即可。

更改后的样子

然后可以去安装一个Fira Code字体,下载链接github.com/tonsky/Fira… 安装Regular(常规)的版本即可.然后鼠标移到菜单栏Sublime Text -> Preferences > Settings在右边的窗口(user)中添加字体的配置:

    "font_face": "Fira Code",

你还可以调整下字体大小,行间距,设置使用空格代替tab键等,如我的如下:

        "font_face": "Fira Code",
    "font_size": 16,
    "line_padding_bottom": 4,
    "line_padding_top": 4,
    "tab_size": 4,
    "translate_tabs_to_spaces": true

更多的配置大家可以查看Sublime Text -> Preferences > Settings在左边边的窗口(Default), 只需将配置复制到右边的(User)窗口中,覆写它即可.

查找文件和查找函数的快捷键

使用快捷键来全局搜索文件和方法会提升很多效率:

搜索文件:command + p
搜索方法:command + r,或者command + p, 在跳出的搜索框输入 @ 符合,就变成搜索方法了

也可以搜索文件的同时搜索方法,如我要搜索AuthController.php中的create方法,可以这样写AuthController@create,可以快速定位到create方法中。

还有一个更快速的快捷键:command + shift + r, 全局查看类或方法,自己试一下,非常好用.

快速创建、重命名和删除文件

我们可以在左边栏点击右键->New File来创建文件,但是还有一种更快速的方法,我们来看一下。我们只需要安装一个AdvanceNewFile的插件

装完后,我们使用command + option + n快捷键就可以创建文件了,比如要常见一个zhoujiping/index.blade.php的视图,见下图:

快速创建文件

如果想创建一个和正在编辑的文件具有相同目录的文件,可以按如下操作:

按绝对路径创建

除了创建文件,你还可以重命名当前文件,或者删除当前文件,按住command + shirt + p, 输入查找rename,选择 ANF:Rename File, 默认没有显示文件路径和名,还需要配置下, 打开AdvanceNewFile的setting-user配置文件, 输入以下内容:

{
    "rename_default": "",
}

下面在试一下修改文件,就能显示文件路径和文件名了,至于删除文件,自己搜索delete试下即可

显示路径和名

如果你忘记sublime或者它的插件的一些快捷键,或者要修改配置,都可以去查看各插件的默认配置,setting-default,里面都有详细的注释说明,然后将要修改的配置放到对应的setting-user中即可

Sublime的多窗口编辑

Sublime默认就可以使用多窗口编辑,比如按住command + option + 2,会变成左右两个窗口,3个窗口就command + option + 3,以此类推. 另外还有一个增强插件origami,安装完自己看下setting中的快捷键,自己配置也行,这里不多说了.

Sublime的多点编辑

选中一个单词,然后不断的按住command + D,可以同时选中相同的单词,然后可以统一编辑

或者也可以选中一个单词,然后使用control + command + g来选中全部一样的单词,进行统一多点编辑.

sublime多点编辑

构建自己的代码块

使用IDE的一个很大的好处是可以快速生成代码块,Sublime中我们也可以这么做,点击```Tools->Developer->New Snippet, 出现下面的默认代码:


    
    
    
    
    

我们写一个生成php方法的代码块,比如我们输入met,按table键就能生成,我们改下上面的代码:


    
    
    met
    
    source.php

然后建立个snippets文件夹,统一存放我们写的这些代码片段:
代码片段

下面就可以使用met按下tab键来创建我们的代码了,当按第一次tab的时候,光标会聚焦到${1}处,写好方法名,再按下tab,光标会聚焦到${2}处,是不是非常方便.

比如我们再来建立一个Protected function 的方法,如下:


    
    
    pmet
    
    source.php

自动生成Getters 和 Setters

比如说,我们要自动生成下面属性的get和set方法:

搜索安装PHP Getters and Setters插件,安装完毕后,command + shift + p, 搜索php,或者搜索getter, 或setter, 可以生成一个属性的,也可以生成所有的,自己研究下即可。

快速生成get和set

比如说我选择同时生成get和set, 如下:

name;
    }

    /**
     * Sets the value of name.
     *
     * @param mixed $name the name
     *
     * @return self
     */
    protected function setName($name)
    {
        $this->name = $name;

        return $this;
    }

    /**
     * Gets the value of age.
     *
     * @return mixed
     */
    public function getAge()
    {
        return $this->age;
    }

    /**
     * Sets the value of age.
     *
     * @param mixed $age the age
     *
     * @return self
     */
    protected function setAge($age)
    {
        $this->age = $age;

        return $this;
    }
}

快速导入命名空间及自动生成构造函数等

Phpstrom不用你手动的导入命名空间,会自动导入,sublime也可以做到这点, 搜索安装php companion插件.

这个插件没有提供默认快捷键绑定,需要我们要自己配置一下,打开它的github页面github.com/erichard/Su…

上面有详细的配置说明,自己研究下即可,下面我举几个配置的列子,我们先配置一个补全命名空间,如下:

php

// use Finder  当我写出Finder时,然后按下f9快捷键,自动补全像下面这样的命名空间
use Symfony\Component\Finder\Finder;

首先打开快捷键!]配置文件:

PHP companion

[
    {"keys": ["f9"], "command": "expand_fqcn" }
]

你可以按自己的喜好去设置快捷键,这里我设置为f9,保存后即可达到上面的效果.如果存在不同命名空间的同名的类,它会跳出所有的类,你自己选择即可。

不过在PhpStrom中,我们将类的对象依赖注入到方法中,会自动导入命名空间,我们来配置个半自动的,比如说:

public function update(Request $request)
{
}

当我们书写完Request,按下f10, 自动导入命名空间,配置Key Bindings如下:

[
    {"keys": ["f9"], "command": "expand_fqcn" },
    {"keys": ["f10"], "command": "find_use" }
]

这样就能实现我们要的效果了,对于全自动的导入,大家可以看下文档自己配置下。

我们再来配置一个构造函数自动生成的绑定,配置Key Bindings如下:

[
    {"keys": ["f9"], "command": "expand_fqcn" },
    {"keys": ["f10"], "command": "find_use" },
    {"keys": ["f7"], "command": "insert_php_constructor_property" },
]

ok, 下面再我们的类中按下f7就可以出现我们要的构造函数了:
快速创建构造函数

你不断的按f7, 会不断的添加新的属性,试试。

如果你想将属性的private更改为protected, 你可以更改php companion的 user配置文件:

{
    // Sort the list of use statements by their line length
    "use_sort_length": true,

    // Visibility of properties generated by the "insert constructor property"
    // command. "public", "protected" or "private"
    "visibility": "protected",
}

在sublime中运行Artisan命令

搜索安装laravel 5 atisan, 安装完毕后, command + shift + p,搜索artisan,即可出现一堆的命令供你选择。当然,如果你习惯使用终端也一样,个人比较喜欢用终端执行,只不过这种方式会更快些.

代码格式化为 PSR-2 代码风格规范

现在的很多php框架都支持了PSR-2的代码风格规范,我们可以安装个可以自动格式化的组件 friendsofphp/php-cs-fixer, 使用composer全局安装,进入命令行

➜  composer global require friendsofphp/php-cs-fixer
Changed current directory to /Users/zhoujiping/.composer
Using version ^2.0 for friendsofphp/php-cs-fixer
./composer.json has been updated
Loading composer repositories with package information
Updating dependencies (including require-dev)
  - Installing sebastian/diff (1.4.1)
    Downloading: 100%         

  - Installing symfony/stopwatch (v3.2.0)
    Downloading: 100%         

  - Installing symfony/polyfill-php54 (v1.3.0)
    Downloading: 100%         

  - Installing symfony/finder (v3.2.0)
    Downloading: 100%         

  - Installing symfony/filesystem (v3.2.0)
    Downloading: Failed       
    Downloading: 100%         

  - Installing symfony/event-dispatcher (v3.2.0)
    Downloading: 100%         

  - Installing friendsofphp/php-cs-fixer (v2.0.0)
    Downloading: 100%         

symfony/event-dispatcher suggests installing symfony/dependency-injection ()
symfony/event-dispatcher suggests installing symfony/http-kernel ()
Writing lock file
Generating autoload files

跑一下 php-cs-fixer

➜  php-cs-fixer  
PHP CS Fixer version 2.0.0 by Fabien Potencier and Dariusz Ruminski

Usage:
  command [options] [arguments]

Options:
  -h, --help            Display this help message
  -q, --quiet           Do not output any message
  -V, --version         Display this application version
      --ansi            Force ANSI output
      --no-ansi         Disable ANSI output
  -n, --no-interaction  Do not ask any interactive question
  -v|vv|vvv, --verbose  Increase the verbosity of messages: 1 for normal output, 2 for more verbose output and 3 for debug

Available commands:
  describe     Describe rule / ruleset.
  fix          Fixes a directory or a file.
  help         Displays help for a command
  list         Lists commands
  readme       Generates the README content, based on the fix command help.
  self-update  Update php-cs-fixer.phar to the latest stable version.
  selfupdate   Update php-cs-fixer.phar to the latest stable version.

我们可以在命令行中手动的使用它:

php-cs-fixer fix Person.php --rules=@PSR2

下面我们将其添加到sublime中,点击Tools->Build System -> New Build System,输入以下内容

{
    "shell_cmd": "php-cs-fixer fix $file --rules=@PSR2"
}

保存如下:
psr-2格式

现在只要按住command + b, 就可以将当前php文件格式化为psr-2格式了。如果你的电脑比较老,那就少用,我的有点慢,自己把psr标准看熟去写就行。

php语法检查插件

先搜索安装sublimeLinter插件, 然后安装sublimeLinter-php插件, 比如有语法错误,就会按下面这样显示

语法检查

上面这些插件我们不用全部都装,真的觉得有必要用时再去安装。

结束。

评论