Front-end development tool Sublime Text 3 tips for using and summarizing notes

Source: Internet
Author: User

This article is I use the tool for the front-end development of the self-summary, the idea may not be very clear, but still hope to the reader you have help, do not put this article collection up moldy Oh, no matter how many times the shortcut keys, but also more than the actual operation of their own several times.

    1. currently the official version of Sublime text 2 Build 2221, while Sublime text 3 is the test phase, it is recommended to download the official version registration Machine Sublimetextkeygen Download
    2. Open the registration machine, click the middle "Patch key" to open "Sublime_text.exe" file confirmation, and then arbitrarily modify the "Name" and then "Generate", copy the inside of the License. (Note: Please follow the steps to do otherwise unsuccessful!) Please do not turn off the registration machine at this time, do not assist the dashed part of the text ~)
    3. Open Sublime Text 2, to help–enter license paste Click to confirm, complete ~
    4. If you have enough silver, please support genuine software, but sublimetext price is not cheap, USD $70~
    5. Sublime Text 3 official version released. please support the genuine!

######## Sublime Text 3 using shortcut keys ########

    1. Ctrl+alt+f can organize the format of JS code, need to be selected after use. (Requires plug-in support: format)
    2. Ctrl+ait+p brings up a powerful command panel.
    3. Ctrl+p Quick Function-
    4. Ctrl+r call up @ function to quickly locate function name
    5. ctrl+g : Function can quickly locate the line number, debugging changes when the style is used.
    6. Ctrl+~ pull up the control belt
    7. Ctrl+d and Alt+f3 the former " Continuous press and hold can choose to select the same String", the latter "custom select text, press to Select all the same text at once ."
    8. ctrl+/comments the entire line. ctrl+shift+/the selected part of the comment.
    9. For more shortcuts, please check out the tab!

######## Sublime Text 3 using skill efficiency ########

    1. The mouse selects multiple lines, press Ctrl+shift+l (command+shift+l) to edit these lines at the same time;
    2. The mouse selects the text, repeatedly presses the ctrl+d (command+d) to continue downward simultaneously selects the next same text to simultaneously edit;
    3. Mouse selected text, press ALT+F3 (Win) or ctrl+command+g (MAC) can select all the same text at once for simultaneous editing;
    4. shift+ right mouse button (Win) or option+ left mouse button (MAC) or using the mouse button can be used to vertical multi-line selection;
    5. CTRL + left mouse button (Win) or command+ left mouse button (MAC) to manually select multiple text to edit at the same time

######## Sublime Text 3 Landscaping ########

    • The change of the skin label for right angle, do not like the default mellow, this set of skin name called: Theme–nil, at that time saw a wooden wood wood wooden blog An article (suddenly found that I and his aesthetic so match ~)
    • Code color scheme, color schemes for hackers- Base16 address: Https://github.com/chriskempson/base16
    • Another set of topics: Spacegray, Project address: http://kkga.github.io/spacegray/, this set of themes integrated BASE16 color scheme, but also now I use the theme, the interface preview, see the first image of this article

######## Sublime Text 3 plugin tips ########

    1. Sublime Text plugin removal step: "Ctrl+shift+p"-"Remove package"-"Find the plugin you need to remove and click to delete"
    2. Solve GBK and GB2312 garbled problem: Install plug-in "ConvertToUTF8"
    3. More information: Sublime Text – the Sexy code Editor! The programmer must be an artifact! Cross-platform Support Win/mac/linux

######## List of plugins I use (Updated October 1, 2014) ########

  1. Package Control: This is a tool to facilitate the management of plug-ins, so it is best to install this plugin, using the shortcut key ctrl+shift+p Call, the official address: https:// packagecontrol.io/
  2. YUI Compressor: Compress js and css file, press F7 key, if compress the current file (demo.js), then the compressed file (demo.min.js) saved in the file's sibling directory, need to install Java JDK. How to use:Sublime Text plugin: YUI Compressor
  3. Jsformat: There is compression when let can also format, this is the format of JS, shortcut key ctrl+alt+f.
  4. ConvertToUTF8: Sublime only supports UTF8 encoding, the plugin can display and edit a variety of non-UTF8 encoded files
  5. Emmet: That is the famous zencoding, the new version of the name changed to "Ant" English word Emmet, which is the front-end development of the super weapon, can be super-fast writing html/css/js, of course, this plugin also supports a variety of compilation environment, As common: Eclipse/aptana, Coda, notepad++, Adobe Dreamweaver, TextMate, etc., How to use: official website
  6. jquery and CSS3: front-end development essentials.
  7. ClipboardHistorical: Clipboard history, only supports sublime Text 2
  8. brackethighlighter: Highlighting matching parentheses, quotes, and labels, and even custom tags, when you see a dense code that contains a nested relationship between tags, this plug-in can help you figure out the code structure, quickly locate parentheses, The range within the quotation marks and tags, of course it is also a front-end prerequisite.
  9. Csscomb: It can reorder the cluttered CSS properties by following certain CSS property collation rules. Select the CSS code to sort, press ctrl+shift+c, you can reorder the CSS properties, the code from this simple and orderly easy to maintain, if the code is not selected, the plug-in will sort all the CSS properties in the file. Of course, you can customize the CSS property collation, open the Csscomb.sublime-settings file in the plug-in directory, change the inside of the CSS property order is OK. Because this plugin is written in PHP, to make his work need to add the path of PHP in the environment variables, please see the Csscomb official web site instructions.

    plugin : https://github.com/csscomb/CSScomb-for-Sublime

  10. Alignment Sublime Integrated code formatting plug-in, can replace the Jsformat, CSS format part of the function.

Front-end development tool Sublime Text 3 tips for using and summarizing notes

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.