Front-end artifact sublime text 2

Sublime text 2 is a lightweight, concise, efficient, and cross-platform editor. Previously, the blogger used notepdd ++ to write the frontend.CodeIt's quite easy to use. I have heard of the name of sublime for a long time and have never been too lazy to try it. I think it's good to use tools. These days, I had a sudden whim and tried again. The result is... As a result, the blogger abandoned notepad ++... Based on the experiences of the bloggers over the past few days, I will introduce this front-end artifact. It takes a short time to use it. I hope you can see the official haihan in some improper aspects.

 

Windows sublime has two versions:
Normal)
Sublime text-related files are placed in two directories, one for placementProgramAnd Related Files.
Portable edition (portable)
All sublime text-related files are placed in a folder (we recommend that you replace the file with another computer and copy the file directly. You don't have to install the plug-in any more, what is the configuration? It's so nice)

 

In addition to its own ease of use, sublime personally feels that it has powerful plug-ins. The following describes how to install the plug-ins:
1. Directly install
It is very convenient to install the sublime text 2 plug-in. You can directly download the installation package and decompress it to the packages directory (preferences-> packages ).
2. Use the package control component for installation (recommended)
Press Ctrl + '(' is the one above the tab key. After reading other tutorials, I am looking for a long time ...) Call up console
Paste the following code to the bottom of the command line and press Enter:
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 ())
Restart sublime text 2.
If you see package control in perferences-> package settings, the installation is successful.

Press Ctrl + Shift + P, enter install package, and enter the plug-in name and press Enter. Everything looks wonderful, but in a proxy environment, this installation method may fail. My company's environment is like this. How can we solve this problem? The solution is as follows:

1. Download proxifier, please google (proxifier's registration opportunity is treated as a Trojan by security software and must be released first)
2. Set Proxy Server
Configuration file = "Proxy Server =" added
Proxy address: such as xx.xx.com
Port: such as 8080
HTTPS
3. Configure proxy rules
Add the corresponding EXE of sublime to the proxy rule.

 

Utility list(The following plug-ins have been installed by bloggers):

Emmet)
Quick to write HTML code, CTRL + ALT + enter call out, see: http://docs.emmet.io/abbreviations/syntax/

 

Sublimelinter
A plug-in that supports lint syntax. CTRL + ALT + l call out (in conflict with QQ lock, change the hotkey yourself) can highlight lines of code that Linter thinks are wrong.

 

Jquery
Don't miss jquery. It's a surprise to press the tab key after writing it;

Alignment
Code alignment, such as writing a few variables. After the selected variable is selected, CTRL + ALT + A will be liked by people who have cleanliness in the code.

Before

After

 

Bracket highlighter
Highlighted code matching, which can match parentheses, quotation marks, tags, etc.

 

Docblockr
Automatically comments, fully compliant with the jsdoc standard. Simply press/** and no longer need to worry about comments.

Prefixr
You can add private suffixes such as WebKit automatically when writing CSS. Press CTRL + ALT + X to trigger

Tag
HTML format, right-click auto-format tags on ducument.

JS format
A js Code formatting plug-in that uses CTRL + ALT + F to format the Code, making the code beautiful in minutes

Theme-soda

This topic is cool. Add it to preferences> user setting.
"Color_scheme": "packages/color scheme-default/monokai soda. tmtheme ",
"Theme": "soda dark. sublime-Theme"
Install new code color scheme
Click preferences-> browse packages to open the package installation directory, find the color scheme-default folder, and install the downloaded new color.

Sublime text shortcut:
CTRL + Shift + P: Open the Command Panel
CTRL + P: Search for files in the project
CTRL + G: the row to jump
CTRL + W: Close the currently opened file
CTRL + Shift + W: Close all open files
CTRL + Shift + V: paste and format
CTRL + D: select a word. If you repeat a word, you can add and select the next same word.
CTRL + L: select a row. You can add and select the next row in sequence.
CTRL + Shift + L: Select multiple rows
CTRL + Shift + enter: Insert a new row before the current row
CTRL + M: Jump to the corresponding brackets
CTRL + u: Soft undo, undo cursor position
CTRL + J: Select TAG content
CTRL + F: Search for content
CTRL + Shift + F: Find and replace
CTRL + H: replace
CTRL + R: Go to Method
CTRL + N: New window
CTRL + K + B: Switch sidebar
CTRL + Shift + M: select the content of the current bracket.
CTRL + F2: Set/delete tags
CTRL +/: comment out the current row
CTRL + Shift +/: insert comments at the current position
CTRL + ALT +/: block annotation, focus on the first line, and write the annotation description
F11: Full Screen
Shift + F11: In Full Screen mode, only the current file is edited.
Alt + F3: select all the same words
Alt + Shift + number: split screen display
Alt + number: Switch to open the nth File
CTRL + tab: Switch the tab
CTRL + Shift + up/down key, can replace rows

 

To do well, you must first sharpen your tools. Yes, sublime is definitely a front-end tool. continue to use it and continue to summarize it. If you have any good plug-ins and tips for sublime, please add them. Thank you.