Sublime Text 2 Usage Tips

First, preface

As a front-end, there is a good development tool is essential, editplus, notepad++ are good tools, lightweight, fast startup (DW is too puffy). Recently, there is a new editor was born, swept the front end of the world, provoked countless love, many front-end ER has abandoned the use of several years of "partner", put her arms--sublime Text2. Sublime Text2 is a cross-platform editor that no longer has to find a suitable, familiar editor for changing platforms. Currently, or beta version, but the function is very strong, update is also very fast, the latest is bulid2181. ST2 is not free, but can be used for free forever, but in the time of saving, occasionally pop up to buy the registration dialog box, that's all. Official address: HTTP://WWW.SUBLIMETEXT.COM/2.

Second, the function

Sublime Text2 is a code highlighting, syntax hints, auto-complete and fast response editor software, not only has a gorgeous interface, but also support plug-in extension mechanism, with her to write code, is absolutely a pleasure.

Interface

First look at the ST2 interface:

L from top to bottom: Title bar ↓ Menu bar ↓tab control bar ↓ Edit Area ↓ status bar;

L from Do Right: Sidebar (can be closed) → Edit area →minimap

Menu bar

Various commands, various settings.

tab bar

Many editors have, if the file editing has not been saved, the upper right corner has a small dot hint to save, if not saved off also do not fear, ST2 is very intimate, will help us automatically save.

Edit Area

This is our main work area, ST2 support Code Auto indent, code folding function.

Describes a few common features:

L Auto-Complete: auto-complete shortcut key is tab, if in the HTML file, input CL press TAB, you can automatically fill the class= "", plus zencoding, even more powerful, after the

L Multi-column editing: Ctrl-click the mouse, there will be multiple flashing cursor, at the same time can modify multiple

Or hold down the middle mouse button and drag

L Code Comment function: ctrl+/, ctrl+shift+/respectively comments and block comments, and then click to remove the comments, ST2 can automatically identify the HTML, CSS or JS files, give different types of comments.

L Line operation: ctrl+alt+↑, ctrl+alt+↓ up or down two lines, ctrl+enter, insert blank line after the cursor, ctrl+d Select similar, you can refer to the following list of shortcut keys.

L Right-click function:

The first 3, we all know, 4th, show unsaved changes, show unsaved changes, red minus indicates deleted content, Green plus sign indicates what's new

Open containing Folder ..., opens the folders containing this file, this is easy to find the relevant files

Copy file path, which allows us to copy the path to the browser to view

Auto-format Tags on Selection format the selected document, so that we can more clearly see the code structure, although the ST2 has automatic indentation function, but when we paste into a piece of code that has not been formatted, we need this to, this feature to install the tag this plugin will appear.

L humanized Design: Although the ST2 is still a beta version, but there are many design details are commendable, such as clicking on a label or brackets, will be displayed at the beginning of the line, easy to see the code results, each layer of nested code between the vertical lines, play the role of visual aids.

Third, set

Sublime Text2 after bulid2181, the "settings" were merged, and now there are only two options, namely system settings and shortcut key settings.

In general, we modify the settings, it is best to copy them in the user changes, so as not to upgrade the default is overwritten.

L Settings: In this file, you can modify a lot of things, such as themes, fonts, font size, whether to display line numbers, automatic indentation, automatic completion. Many of them are selected by default, and I have modified two additional places:

98 rows-Show thumbnail border

101 Lines--highlight the current line of the cursor

Helps us find the cursor position quickly.

L Key Bindings: Shortcut key settings, ST2 many shortcuts, change the time to pay attention not to cover. Because there are many shortcut keys, so the following combination of shortcut keys, first press ctrl+k, Loosen K, and then press J to expand all the code.

L Main shortcut Key list

Ctrl+l Select Entire row (press and hold-continue to select the downstream)

CTRL+KK Delete from cursor to end of line

Ctrl+shift+k Delete an entire row

Ctrl+shift+d the entire line where the cursor is copied, before inserting the line

Ctrl+j merge rows (multiple rows that need to be merged are selected)

Ctrl+ku Change to uppercase

CTRL+KL Change to lowercase

Ctrl+d Word selection (press and hold-continue to select the next same string)

Ctrl+m cursor to start or end position within parentheses

Ctrl+shift+m Select the contents in parentheses (press and hold-continue to select the parent bracket)

ctrl+/Comment Entire line (if selected, same as "ctrl+shift+/" effect)

ctrl+shift+/Comment Selected content

CTRL + Z Undo

Ctrl+y Recovery undo

Ctrl+m cursor jumps to the corresponding parentheses

ALT +. Close the current label

Ctrl+shift+a Select the cursor position parent tag pair child

Ctrl+shift+[Folding Code

Ctrl+shift+] Unwind code

Ctrl+kt Collapsing properties

Ctrl+k0 Expand All

Ctrl+u Soft Undo

Ctrl+t Word Exchange

Tab Indent Auto-complete

Shift+tab removing indents

Ctrl+shift+↑ and Upstream Interchange

Ctrl+shift+↓ and Downlink Interchange

Ctrl+k Backspace Delete from cursor to beginning of line

Ctrl+enter cursor after insertion

Ctrl+shift+enter Cursor Front Insertion

CTRL+F2 setting bookmarks

F2 Next Bookmark

Shift+f2 Previous Bookmark

Iv. expansion

ST2 is to support plug-in extension, first, we need to install package contro,ctrl+ ' Bring up command line tool, input import urllib2,os;pf= ' package control.sublime-package '; ipp= Sublime.installed_packages_path (); Os.makedirs (IPP) if not os.path.exists (IPP) Else None;open (Os.path.join (IPP,PF), ' WB '). Write (Urllib2.urlopen (' http://sublime.wbond.net/' +pf.replace (', '%20 ')). Read ())

You can enter.

Click Preferences→package Control to display the following pop-up windows:

N Disable Package: Disabling plugins

N Enable package: enabling plugins

N Install package: Installing plugins

N List Package: View the list of installed plugins

N Remove Package: Remove Plugin

N Upgrade Package: Upgrade Plugin

Plugin recommendations:

List of installed plugins:

L zencoding: Front-end prerequisite, rapid development html/css

Input div.wrapper>div.header+div.main+div.footer press TAB to instantly become

or press Ctrl+alt+enter to activate the zencoding console to see the entire dynamic process.

L JSFORMAT, Format JS code, this plugin is very useful, we sometimes see some effects on the internet, want to see how it is implemented, but the code is compressed, difficult to read, not afraid, with ST2 open, press ctrl+alt+5 (This is the shortcut I set), you can let the code restore, It is a long lost in the martial arts "still my beautiful fist."

L tag format tag, let the messy code, instantly neat and clear.

L Brackethighlighter, bracket highlighting

L Clipboard History, shear plate, can save multiple copies of information, press CTRL+ALT+V, you can select the history of the Clipboard

L Goto-css-declaration, jump to the CSS file of the class declaration, easy to modify the view, as shown below, note that the corresponding CSS file to open at the same time.

L Gotorecent, open the recent file, the system has this function, but only to see the last 8, a little uncomfortable, press ctrl+e, select can.

L SCSS, support SCSS syntax highlighting, which comes with a lot of CSS Snippet, whether it is used or converted into, can save a lot of time.

There are many plugins, jquery syntax hints, jshint and so on.

V. Conclusion

All in all, Sublime Text2 is a good code writing tool, has a good-looking UI, humanized detail design, comprehensive functions and extension mechanism, if you have not used, please try, will not let you down. If there are any shortcomings, ST2 currently on the ANSI, GBK Chinese character display is not normal, (using UTF8 encoding is no problem, the package control has a GBK plug-in), I hope ST2 will be able to support the perfect Chinese.

Sublime Text 2 Usage Tips