Sublime Text 3 Plug-in installation and use of shortcut keys

First, preparatory work 1. Download and install sublime Text3

To the official website https://www.sublimetext.com/3 download, the Fool type installment, here omits the innumerable words, then opens can use. 2. Install Package Control

Use CTRL + ' shortcut keys or open the command line via the View->show Console menu, and paste the following code to run:

import urllib.request,os; 
pf = 'Package Control.sublime-package'; 
ipp = sublime.installed_packages_path(); 
urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); 
open(os.path.join(ipp, pf), 'wb').write(urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ','%20')).read())

When you are done, restart sublime and you can see the package settings and package control two submenus under the Preferences menu.

How to install Plug-ins with package control:
1, the use of shortcut keys Ctrl+shift+p (if not out, may be in conflict with other, I will be with the Sogou Wubi Input Method of a shortcut key conflict) or through the Tools->command palette pull up the command panel
2, input Install pull up Install Package option and enter, and then in the list to install the plug-in or directly in the input box you want to install the name of the plug-in.

Well, when you know how to use package control, let's happily build our own editor. second, you deserve to have the common plug-ins 1, Emmet

you can quickly write html/css.
Note: Installing Emmet will also automatically install its dependent PyV8 binary library, the installation PyV8 library will take a long time, you can see the installation process status 2, sublime in the lower left corner of the HTML5

Support HMTL5 specification of the plug-in package, with the Emmet plug-in with the use of better results
How to: Create a new HTML document > Input html5> Click Tab > Auto complement HTML5 Specification document 3, Sublimelinter

a plug-in that supports lint syntax can highlight the lines of code that Linter think is wrong, and it also supports highlighting special annotations such as "TODO" so that it can be quickly positioned. 4, Jsformat

JS code format plug-in.
How to: Use shortcut keys ctrl+alt+f 5, Brackethighlighter

code matching, you can match parentheses, quotes, and other symbols within the range .
How to: Click on a tag or parenthesis to highlight the location of another tag or bracket. 6, Alignment

code Alignment, note is not formatted OH .
How to use: such as writing several variables, select these lines, Ctrl+alt+a, will be left aligned. 7, Doc Blockr

Comment Plugin to generate a beautiful annotation.
/*: Enter to create a code block comment
/**: Enter the parameters in the Auto lookup function, and so on.
It generates comments in JSDoc format.

8, Sidebarenhancements

A toolkit that allows you to customize shortcut keys for opening . He can define different shortcut keys to open different browsers. Use the method reference link below:
http://www.w3cfuns.com/notes/13810/d9b9ed2fb80785dae88a5344ef0f30d4.html 9, ColorPicker

Usually, if you want to use a color selector, you may be able to turn on Photoshop or GIMP. In Sublime Text, you can use the built-in color picker . Once the installation is complete, just press Ctrl/cmd + Shift + C shortcut keys.
Note: Sometimes press Ctrl/cmd + Shift + C shortcut key can not call out the color selector, mostly with other software shortcut key conflict, you can preferences-browse packages find ColorPicker folder, open will see the following several files

This is corresponding to different systems, we can according to their own system to modify the corresponding files in the shortcut keys, I was modified to Ctrl+shift+a as follows:

10, Autofilename

Function: shortcut input filename
Introduction: Automatically complete the file name input, such as picture selection
Use: Enter "/" to see other files relative to this project folder

11, JQuery

a plug-in package that supports the jquery specification. 12, Advancednewfile

Suppose you have a folder file. We're entering code, and we want to create a new HTML file under a newer subdirectory. There are many steps in the traditional way, new directories, new files, save, and so on.
But with the plugin, things get a lot simpler, just press Ctrl+shift+n, enter folders and file names, and you'll see the following effects: (Enter, you'll find that the files in the subdirectory have been created.) ）
13. JavaScript Next

Perfect support for ECMAScript 6.
JavaScript Next provides better syntax highlighting than the default JavaScript package , and he perfectly supports ECMAScript 6.
It is recommended that you fully use JavaScript next instead of JavaScript Package. 14, CSS3

provides syntax highlighting. by default, it's a white plain text that's hard to see. 15, Color highlighter

CSS color highlighting, will detect the CSS file color code, whether it is hex code or RGB code can be very good display, is very cool.
Color highlighter can be set to use background color or border hint colors, I usually do this in the settings:

{"Ha_style": "Filled", "Icons": false}

The effect is as follows:

16, Csscomb

CSS Property sorting.
The order of CSS properties is generally unimportant, because no matter what sequential browsers are rendered correctly. But sorting all the properties helps the code to be neat. In sublime text, select the CSS property and press F5 to sort it alphabetically, or right-click Run Csscomb.

17. CSS Format

CSS formatting.
How to: Right-"CSS format-" Expanded
Effect:

There are other functions, such as the right Key-"CSS format-" compact can be a compact CSS in a row, the effect is as follows:

18, ConvertToUTF8

GBK encoding compatible. 19, Auto close HTML Tags

Function: When writing HTML code, the input ">" will automatically produce the corresponding close tag </>. 20, Nodejs

Features: Node code hints
Tutorial: Https://sublime.wbond.net/packages/Nodejs 21, A File Icon

To beautify the icon in front of the file, the effect is as follows:

22, Htmlbeautify

Format the HTML code.
How to: Select the code, and then press the shortcut key ctrl+alt+shift+f or edit->beautify HTML Three, shortcut keys to use--let you move the arrow alt+f3

When you press the shortcut key when text is selected, you can edit it all at once by selecting all the same text (such as variable name, function name, and so on). CTRL + C, CTRL + V

When the cursor hovers over a row, press CTRL + C to copy an entire line, and then CTRL + V to paste it into the next line. Iv. Other Use techniques

1, Sublime in the sidebar click on a file, note that Click Preview, double hit Open , click, open the top of the file is italic, then if you click another file, this file will be replaced, and double-click a file, the title is not italic, And then open another file will not replace it, but to open a tab page.

2, add sublime Text3 to the right menu, refer to the link below: https://my.oschina.net/adairs/blog/466777#comment-list
3, I have included all plug-ins and configuration information Sublime Text 3 folder uploaded to the https://github.com/Paranoidyang/sublimeText3, you can download after the replacement of their own, This will not have to be installed (through preferences-Browse packages can find the folder location).