Over the past few years, Sublime Text 2 has emerged as a tool for developers to use for text editing, with significant advantages in the industry. The reason behind this is that it has lightning-fast response times, configurable features and a range of other killer functions.
In this article, we will introduce some tips and tricks to help you with your development efforts.
Navigation system
We know that it is important to find a code base (codebase) when doing any non-trivial project. In Sublime Text 2, you can use its sidebar to navigate through the public folder, but it can also make the process painful when too many files.
But fortunately there is a divine trait called goto anything. When you press and hold cmd/ctrl+p, an auto-complete list appears. This list will show all the files in this project, then you can use the sublime Text 2 smart Fuzzy match to filter what you want.
Figure Description: Use the sublime Text 2 Mighty Command panel to arm your fingers.
For example, if you have a file called Myawesomethinger.js, just enter mat in the AutoComplete list and you'll find it effortlessly. For example, if you have a file called myawesomethinger.css, you can narrow your search target to matcss. Intelligent fuzzy Matching also allows you to easily index "Tesmat" to the file called "Myawesomethinger.js" in the tests directory.
So your files can basically be found in seconds. By the right, forget to introduce the next goto anything what exactly is a thing. Not as the name implies, this is far more than just looking for documents so simple. For example, if you want to teleport from the error message to the corresponding code location, you simply append a < number > to the auto-complete list.
For example, on line 123th of the file, enter mat:123. If you are tracking this function, just change it to @<, such as [email protected]. In order to narrow the context to the current file,: And @ can also be used independently.
Command panel
Sublime Text 2 provides a lot of photographic memory for text editors, but it may take a certain amount of brainpower to remember shortcuts to all commands, and it's really painful to query the menu. But it doesn't matter, the command panel (Cmd/ctrl + shift+p) will help you. Like goto anything, the command panel is also an auto-complete list that supports intelligent fuzzy matching, and hemp doesn't have to worry about us getting orders.
Forgot how to hide the sidebar? Just type Sidebar in the command panel and you'll see a big wave of commands to hide the sidebar. Want to fold up the code? You can enter fold. You will find that keyboard shortcuts are also displayed in the AutoComplete list to help you strengthen your memory.
Multi-Select function
Sublime Text 2 has done a lot of good things for us, the biggest good thing is the multi-choice function. The static language (such as Java) used by the Siege division is convenient for text editors, especially reserved variables. Multiple selection features even in the editing field to promote the bright place, mastering the check function will make the siege from the text editor to get unparalleled satisfaction and accomplishment.
Six ways to initialize multiple selection functions:
- One, add next/previous line add next row/back command (under OS X with Cmd+ctrl+up/down,linux/windows under ctrl+alt+up/down)
- Two, Cmd/ctrl + click to add mouse cursor
- Three, Split into lines | Convert a selection to multiple single-line selections (cmd/ctrl+shift+l)
- Four, Alt + drag (OS x) or shift+ right-click Drag (linux/windows)
- Five, Quick Add Next | Quick Add next (cmd/ctrl+d)
- Six, Quick Find all | Quick Find All (OS x under Cmd+ctrl+g, linux/windows under alt+f3)
The last one is most used, because you can quickly and easily control the selection, even without a mouse. With this feature, you can also continue to invoke the current selection the next time. This makes it easy to rename variables.
The quick Add next command is not just for variables, it can also be used for symbols. For example, when you are adjusting the format, you can insert a space between the parentheses and the curly braces by selecting "{"). In order to control the format better and more precisely, use the "Skip Next" command (cmd/ctrl+k) to jump the selection, "Undo Selection" (cmd/ctrl+u) is used to cancel the previous operation.
Figure Description: The goto anything feature of Sublime Text 2 makes your project a duck to the surface.
The flash of multiple selection functions is often inseparable from what you have to do. The command panel is as easy as copying and pasting as you wish. You can quickly build new ones based on old code. Specifically, let's look at the following or this example:
<div id="animal" data-favourite-animal="dog">Dog</div>
<div id="colour" data-favourite-colour="blue">Blue</div>
<script>
var favouriteAnimal = document.getElementById('animal').dataset('');
var favouriteColour = document.getElementById('colour').dataset('');
</script> |
|
In this example, we have two div with data attributes, and some JS code to release the data values. What remains to be done is the key to the data set, in this case Favouriteanimal and favouritecolour (data attributes are automatically matched to the hump in JavaScript). Go on:
- One, move the mouse cursor over the favourite in the first Div.
- Second, press once cmd/ctrl+d to select the word, repeat once, also select the following line of "favorite".
- Three, press and hold Cmd/ctrl+shift, and click the right ARROW key a few (do not choose Favourite-animal and Favourite-colour) you can insert the next word in the selection.
- Four, copy the selected
- Five, put a few caret (^) in the data set call, use Cmd/ctrl+ click, and then paste in the data attributes of the Div.
For example, we have the following code:
var favouriteAnimal = document.getElementById('animal').dataset
('favourite-animal');
var favouriteColour = document.getElementById('colour').dataset
('favourite-colour'); |
|
Very simple, we just turn the key point into the hump:
- One, just select the hyphen symbol between "favourite" and "animal", and then press cmd/ctrl+d to select the hyphen symbol below.
- Two, then delete the two hyphenation symbols.
- Three, press cmd/ctrl+shift+right to select the first letter of the next word, that is, select "a" in "Animal" and "C" in "Color".
- Four, try the command panel (cmd/ctrl+shift+p), and then enter upper above to find the conversion City Capital letter function. Get!
var favouriteAnimal = document.getElementById('animal').
dataset('favouriteAnimal');
var favouriteColour = document.getElementById('colour').
dataset('favouriteColour'); |
|
This example may not be as powerful as you do in a small amount of code, but it saves a lot of time on large projects. Multiple selection features especially when you find yourself repeatedly entering the same thing, stop and ask yourself if you want to try this function, and then you will find that life will be so different.
Figure Description: Sublime Text 2 interface, display its default text color scheme.
Continue to explore
This article deals with some of the major new features of Sublime Text 2, of course, not just these. Before you have tried its command panel and check function, you will not find that the text editor you are using is so great!
Sublime Text 2