【前端-笔记】快乐的sublime编辑器（mac操作版）

快乐的sublime编辑器（mac操作版）

该笔记是由慕课网happypeter录制的学习笔记，基本按照章节顺序记录的，但不完全匹配

视频网址：http://www.imooc.com/learn/333

作者的笔记（老版）：https://github.com/happypeter/happysublime

作者的笔记（新版）：http://c.haoduoshipin.com/happysublime/

---

基础配置（还不会用）iterm（终端仿真程序）终端命令行

～ cd bin

bin ln -s /Applications/Sublime\ Text.app/Contents/SharedSupport/bin/subl subl

bin subl .

//找到sublime的可执行文件，在当前位置创建一个符号链接，以后可以用subl   .来打开当前目录

---

第3章+第5章   使用控制面板的几个事例

shift+command+p：  打开控制面板

1.搜索sidebar 就是打开／关闭侧边栏，并且在右边有快捷键的说明 command+k，command+b

2.搜索reindent lines  就是快速调整缩进

3.搜索key bindings  就是定义所有快捷键的文档，其中【super=command】

{---设置快捷键---快速调整缩进---}

    {a.control+~//打开工作台     

    b.sublime.log_commands(True) 

    c.shift+command+p中查找reindent

    d.在控制台中找到reindent相应的属性              此时将快速调整缩进功能的快捷键改为shift+tab

        

    e.最终的设置语句为：

            [

                {"keys":["shift+tab"],"command":"reindent","args":{"single_line":false}},

            ]

    }

4.搜索settings

{---设置自定--设置字体默认大小等---}

    {a.在default文件中找到对应属性

    b.复制到user文件中，并对相应值进行修改

    c.最终的设置语句为：

            "font_size": 14,

            "line_padding_top": 7,     …..

    }

补充说明：

    自定制的数据会被保存在user文件夹中（打开方式sublime text-preferences-browse packages下）

    其中有：

        自己绑定的快捷键的配置文件：Default (OSX).sublime-keymap

        偏好设置文件：Preferences.sublime-settings

---

第4章   一些快捷键

command+ +/-                  调整字体大小

command+ j                      合并两行

command+ [ / ]                  后退一级／缩进一级

command+ l                      选择当前行

command+ enter              该行任意一处敲回车，不影响改行

shift+command+enter      在该行之上要开辟一行

alt+ 左／右                        光标以单词为单位  左右跳

alt+shift+左／右                以单词为单位  进行选择

command+shift+左右上下以行／上下块为单位  进行选择

command+／                    取消注释

control+space                   代码补全

---

第6章   用package control来安装拓展包

查看现有的拓展包：（iterm终端输入以下内容可以查看）

cd /Applications/Sublime\ Text.app

cd Contents/MacOS/Packages

ls

安装package control： 

 https://packagecontrol.io/ 

a.点击网页右边installation，依次执行网页要求

b.重新启动sublime

使用package control：(操作顺序为a+b+egn)

a.shift+command+p  搜索install package 回车

b.自动读取package control网站上所有包的列表,如下，就可搜索想要的包了：

eg1：搜索 railscast(一种颜色主题)

回车后，sublime就会去网站上下载该包，并安装好

打开Package Control.sublime-settings文件后

可以看到添加了包的列表，如下

之后再preferences 的color schems中选择应用该颜色主题

同时打开Preferences.sublime-settings-user文件，可以看到自动添加的颜色主题信息 

eg2：搜索AdvancedNewFile(在指定层级下快速新建文件)

安装后alt+command+n打开对话框之后，就可以直接在…/comments文件夹下新建show.html.erb文件

eg3: 搜索Git

对文件有修改保存之后，如果想上传到github

    shift+command+p

    git add current file

    git commit

    填写message

    command+w

    shift+command+p

    git push就可以把这次修改推送到github之上

---

第7章   查找，向前向后跳

command+p: GoTo Anyting 快速查找并定位当前查找内容

    文件名:跟行号

    文件名@类名／属性等

    文件名#跟查找字符串

alt+command+f：替换

command+f ：查找          回车：查找下一处          shift+回车：查找上一处

右键点击文件夹-find in folder: 查找     f4：查找下一处     shift+f4:查找上一处

control+ -：向后跳，跳回上次光标内容

control+shift+ - ：向前跳

command+d：多点编辑模式

---

第8章  必备插件emmet--代码补齐功能

系统自带的：

    shift+command+p

    set syntax: html    把文件类型设置为html

        此时在文件中写html后敲tab键，就能自动补齐thml文件结构，如下：

            

        其他效果：

        白色字体为输入内容，按tab键后会自动补全为下面黄色内容

        

    set syntax: css    把文件类型设置为css

        

安装插件emmet后的功能：（安装步骤按package control中提示的安装）

    body标签中写hello peter 

    打开命令面板 敲 wrap with abbreviation（快捷键 control+w）

    出现最下面的输入框，在框内输入相应内容，可以快速得到补齐内容如下：

        

    该功能的逆操作

    打开命令面板 敲 remove tag （快捷键command+’）

    每敲一次command+’就撤销一次

---

第9章   snippets--允许用户自己定义代码小片段

以后再补9，10，11章内容的学习.......