前端神器之Sublime Text2/3簡單明瞭使用總結

爲何叫神器呢?javascript

我總結以下:css

第一:也是最重要的,它佔內存很小(就如同notepad++那般迅速打開,因此那款其實也不錯~)。通常IDE好比WebStorm(它也是一款神器來着),Aptana(也比較經常使用),還有先後結合的Zend Studio 等都略顯臃腫,打開太慢,耗內存太大。html

第二:主題豐富,漂亮的界面。各式各樣的主題能夠知足你的視覺美。java

第三:支持的插件豐富多樣。不少插件都能讓你得到不同的體驗。python

第四:支持命令快捷鍵方式。就如同vim那般有廣闊的命令快捷。git

 

好吧,那就來下載安裝吧。github

Sublime Text2或者3都不要緊,3也只是做爲2的beta版本,因此仍是推薦3吧,支持新版嘛。2和3在使用方法功能上也有差別~vim

(1)你能夠去官網下載對應版本,但可能須要輸入序列號什麼的。windows

     訪問http://www.sublimetext.com/2下載2.x版本。sublime-text

  或從http://www.sublimetext.com/3下載3.x版本。

  註冊碼(僅供我的非商業應用):

  

----- BEGIN LICENSE ------ 
Alexander 
Single User License 
EA7E-814345 
51F47F09 4EAB1285 7827EFF0 8B1207DC 
A76A6EA3 E1A1CA7A DC1F2703 14,897,784 
8EDC1C82 3F2A58B9 1C0C8B24 67686432 
281245B3 6233DE5C ADC5C2F9 61FB8A04 
171B63EF 86BA423F 6AC884FD 3273A7AA 
5F50A6DB CE7859AE D62D2B37 AEEDD8C2 
078A8A20 70EEA791 84F48C1E 8ABA7DEB 
0B3907C0 C9A3523B 0091A045 6F67AED8 
------ END LICENSE ------
----- BEGIN LICENSE -----
Andrew Weber
 Single User License
 EA7E-855605
 813A03DD 5E4AD9E6 6C0EEB94 BC99798F
 942194A6 02396E98 E62C9979 4BB979FE
 91424C9D A45400BF F6747D88 2FB88078
 90F5CC94 1CDC92DC 8457107A F151657B
 1D22E383 A997F016 42397640 33F41CFC
 E1D0AE85 A0BBD039 0E9C8D55 E1B89D5D
 5CDB7036 E56DE1C0 EFCC0840 650CD3A6
 B98FC99C 8FAC73EE D2B95564 DF450523
 ------ END LICENSE ------

(2)通常官網下來的都是英文原版的,能夠網上找些中文包放進去就好了。你也能夠直接去其餘網站下載Sublime Text,通常下下來就能夠直接使用了。。

先來基本配置

基本配置能夠在窗口布局的那幾個選項本身設定,固然也能夠在配置文件裏邊直接開幹。

配置文件在:preferences-setting user  或者 setting default

由於user的能夠覆蓋default的,並且你重裝啊什麼的也不怕被抹掉,因此推薦你直接寫進setting user裏邊

我是text3 中文版的:

 

直接在裏邊寫點配置信息就好了,好比:

{
    //字體大小
    "font_size": 11.0,
    //字體類型
    "font_face": "微軟雅黑",
    // 設置每一行到頂部,以像素爲單位的間距,效果至關於行距
    "line_padding_top": 2,
    // 設置每一行到底部,以像素爲單位的間距,效果至關於行距
    "line_padding_bottom": 2,
       //檢查更新
    "update_check":false,
    //長單詞換行形式
    "word_wrap":"auto",
    // html和xml下突出顯示光標所在標籤的兩端,影響HTML、XML、CSS等
    "match_tags": true,    
    // 是否顯示代碼摺疊按鈕
    "fold_buttons": true,
    // 代碼提示
    "auto_complete": true,
    // 默認編碼格式
    "default_encoding": "UTF-8",
    // 左邊邊欄文件夾動畫
    "tree_animation_enabled": true,
    //刪除你想要忽略的插件
    "ignored_packages":
    [
        "Vintage",
        "YUI Compressor"
    ]
 
}

下邊總結了一些更多的配置信息,須要的可打開看看~

  1 // While you can edit this file, it's best to put your changes in
  2 
  3 // "User/Preferences.sublime-settings", which overrides the settings in here.
  4 //
  5 // Settings may also be placed in file type specific options files, for
  6 // example, in Packages/Python/Python.sublime-settings for python files.
  7 {
  8     // Sets the colors used within the text area
  9     //主題文件
 10     "color_scheme": "Packages/Color Scheme - Default/Monokai.tmTheme",
 11 
 12     // Note that the font_face and font_size are overriden in the platform
 13     // specific settings file, for example, "Preferences (Linux).sublime-settings".
 14     // Because of this, setting them here will have no effect: you must set them
 15     // in your User File Preferences.
 16     //字體樣式、大小
 17     "font_face": "",
 18     "font_size": 10,
 19 
 20     // Valid options are "no_bold", "no_italic", "no_antialias", "gray_antialias",
 21     // "subpixel_antialias", "no_round" (OS X only) and "directwrite" (Windows only)
 22     // 字體選項:no_bold不顯示粗體字,no_italic不顯示斜體字,no_antialias和no_antialias關閉反鋸齒
 23     // subpixel_antialias和no_round是OS X系統獨有的
 24     // directwrite是Windows系統獨有的
 25     "font_options": [],
 26 
 27     // Characters that are considered to separate words
 28     // 在文字上雙擊會全選當前的內容,若是裏面出現如下字符,就會被截斷
 29     "word_separators": "./\\()\"'-:,.;<>~!@#$%^&*|+=[]{}`~?",
 30 
 31     // Set to false to prevent line numbers being drawn in the gutter
 32     // 是否顯示行號
 33     "line_numbers": true,
 34 
 35     // Set to false to hide the gutter altogether
 36     // 是否顯示行號邊欄
 37     "gutter": true,
 38 
 39     // Spacing between the gutter and the text
 40     // 行號邊欄和文字的間距
 41     "margin": 4,
 42 
 43     // Fold buttons are the triangles shown in the gutter to fold regions of text
 44     // 是否顯示代碼摺疊按鈕
 45     "fold_buttons": true,
 46 
 47     // Hides the fold buttons unless the mouse is over the gutter
 48     // 無論鼠標在不在行號邊欄,代碼摺疊按鈕一直顯示
 49     "fade_fold_buttons": true,
 50 
 51     // Columns in which to display vertical rulers
 52     //列顯示垂直標尺,在中括號裏填入數字,寬度按字符計算
 53     "rulers": [],
 54 
 55     // Set to true to turn spell checking on by default
 56     // 是否打開拼寫檢查
 57     "spell_check": false,
 58 
 59     // The number of spaces a tab is considered equal to
 60     // Tab鍵製表符寬度
 61     "tab_size": 4,
 62 
 63     // Set to true to insert spaces when tab is pressed
 64     // 設爲true時,縮進和遇到Tab鍵時使用空格替代
 65     "translate_tabs_to_spaces": false,
 66 
 67     // If translate_tabs_to_spaces is true, use_tab_stops will make tab and
 68     // backspace insert/delete up to the next tabstop
 69     // translate_tabs_to_spaces設置爲true,Tab和Backspace的刪除/插入做用於製表符寬度
 70     // 不然做用於單個空格
 71     "use_tab_stops": true,
 72 
 73     // Set to false to disable detection of tabs vs. spaces on load
 74     // false時禁止在載入的時候檢測製表符和空格
 75     "detect_indentation": true,
 76 
 77     // Calculates indentation automatically when pressing enter
 78     // 按回車時,自動與製表位對齊
 79     "auto_indent": true,
 80 
 81     // Makes auto indent a little smarter, e.g., by indenting the next line
 82     // after an if statement in C. Requires auto_indent to be enabled.
 83     //針對C語言的
 84     "smart_indent": true,
 85 
 86     // Adds whitespace up to the first open bracket when indenting. Requires
 87     // auto_indent to be enabled.
 88     // 須要啓用auto_indent,第一次打開括號縮進時插入空格?(沒測試出來效果…)
 89     "indent_to_bracket": false,
 90 
 91     // Trims white space added by auto_indent when moving the caret off the
 92     // line.
 93     // 顯示對齊的白線是否根據回車、tab等操做自動填補
 94     "trim_automatic_white_space": true,
 95 
 96     // Disables horizontal scrolling if enabled.
 97     // May be set to true, false, or "auto", where it will be disabled for
 98     // source code, and otherwise enabled.
 99     // 是否自動換行,若是選auto,須要加雙引號
100     "word_wrap": "auto",
101 
102     // Set to a value other than 0 to force wrapping at that column rather than the
103     // window width
104     // 設置窗口內文字區域的寬度
105     "wrap_width": 0,
106 
107     // Set to false to prevent word wrapped lines from being indented to the same
108     // level
109     // 防止被縮進到同一級的字換行
110     "indent_subsequent_lines": true,
111 
112     // Draws text centered in the window rather than left aligned
113     // 若是沒有定義過,則文件居中顯示(好比新建的文件)
114     "draw_centered": false,
115 
116     // Controls auto pairing of quotes, brackets etc
117     // 自動匹配引號,括號等
118     "auto_match_enabled": true,
119 
120     // Word list to use for spell checking
121     // 拼寫檢查的單詞列表路徑
122     "dictionary": "Packages/Language - English/en_US.dic",
123 
124     // Set to true to draw a border around the visible rectangle on the minimap.
125     // The color of the border will be determined by the "minimapBorder" key in
126     // the color scheme
127     // 代碼地圖的可視區域部分是否加上邊框,邊框的顏色可在配色方案上加入minimapBorder鍵
128     "draw_minimap_border": false,
129 
130     // If enabled, will highlight any line with a caret
131     // 突出顯示當前光標所在的行
132     "highlight_line": false,
133 
134     // Valid values are "smooth", "phase", "blink", "wide" and "solid".、
135     // 設置光標閃動方式
136     "caret_style": "smooth",
137 
138     // Set to false to disable underlining the brackets surrounding the caret
139     // 是否特殊顯示當前光標所在的括號、代碼頭尾閉合標記
140     "match_brackets": true,
141 
142     // Set to false if you'd rather only highlight the brackets when the caret is
143     // next to one
144     // 設爲false時,只有光標在括號或頭尾閉合標記的兩端時,match_brackets才生效
145     "match_brackets_content": true,
146 
147     // Set to false to not highlight square brackets. This only takes effect if
148     // match_brackets is true
149     // 是否突出顯示圓括號,match_brackets爲true生效
150     "match_brackets_square": true,
151 
152     // Set to false to not highlight curly brackets. This only takes effect if
153     // match_brackets is true
154     // 是否突出顯示大括號,match_brackets爲true生效
155     "match_brackets_braces": true,
156 
157     // Set to false to not highlight angle brackets. This only takes effect if
158     // match_brackets is true
159     // 是否突出顯示尖括號,match_brackets爲true生效
160     "match_brackets_angle": false,
161 
162     // Enable visualization of the matching tag in HTML and XML
163     // html和xml下突出顯示光標所在標籤的兩端,影響HTML、XML、CSS等
164     "match_tags": true,
165 
166     // Highlights other occurrences of the currently selected text
167     // 全文突出顯示和當前選中字符相同的字符
168     "match_selection": true,
169 
170     // Additional spacing at the top of each line, in pixels
171     // 設置每一行到頂部,以像素爲單位的間距,效果至關於行距
172     "line_padding_top": 0,
173 
174     // Additional spacing at the bottom of each line, in pixels
175     // 設置每一行到底部,以像素爲單位的間距,效果至關於行距
176     "line_padding_bottom": 0,
177 
178     // Set to false to disable scrolling past the end of the buffer.
179     // On OS X, this value is overridden in the platform specific settings, so
180     // you'll need to place this line in your user settings to override it.
181     // 設置爲false時,滾動到文本的最下方時,沒有緩衝區
182     "scroll_past_end": true,
183 
184     // This controls what happens when pressing up or down when on the first
185     // or last line.
186     // On OS X, this value is overridden in the platform specific settings, so
187     // you'll need to place this line in your user settings to override it.
188     // 控制向上或向下到第一行或最後一行時發生什麼(沒明白也沒試出來)
189     "move_to_limit_on_up_down": false,
190 
191     // Set to "none" to turn off drawing white space, "selection" to draw only the
192     // white space within the selection, and "all" to draw all white space
193     // 按space或tab時,實際會產生白色的點(一個空格一個點)或白色的橫線(tab_size設置的製表符的寬度),選中狀態下才能看到
194     // 設置爲none時,什麼狀況下都不顯示這些點和線
195     // 設置爲selection時,只顯示選中狀態下的點和線
196     // 設置爲all時,則一直顯示
197     "draw_white_space": "selection",
198 
199     // Set to false to turn off the indentation guides.
200     // The color and width of the indent guides may be customized by editing
201     // the corresponding .tmTheme file, and specifying the colors "guide",
202     // "activeGuide" and "stackGuide"
203     // 製表位的對齊白線是否顯示,顏色可在主題文件裏設置(guide,activeGuide,stackGuide)
204     "draw_indent_guides": true,
205 
206     // Controls how the indent guides are drawn, valid options are
207     // "draw_normal" and "draw_active". draw_active will draw the indent
208     // guides containing the caret in a different color.
209     // 製表位的對齊白線,draw_normal爲一直顯示,draw_active爲只顯示當前光標所在的代碼控制域
210     "indent_guide_options": ["draw_normal"],
211 
212     // Set to true to removing trailing white space on save
213     // 爲true時,保存文件時會刪除每行結束後多餘的空格
214     "trim_trailing_white_space_on_save": false,
215 
216     // Set to true to ensure the last line of the file ends in a newline
217     // character when saving
218     // 爲true時,保存文件時光標會在文件的最後向下換一行
219     "ensure_newline_at_eof_on_save": false,
220 
221     // Set to true to automatically save files when switching to a different file
222     // or application
223     // 切換到其它文件標籤或點擊其它非本軟件區域,文件自動保存
224     "save_on_focus_lost": false,
225 
226     // The encoding to use when the encoding can't be determined automatically.
227     // ASCII, UTF-8 and UTF-16 encodings will be automatically detected.
228     // 編碼時不能自動檢測編碼時,將自動檢測ASCII, UTF-8 和 UTF-16
229     "fallback_encoding": "Western (Windows 1252)",
230 
231     // Encoding used when saving new files, and files opened with an undefined
232     // encoding (e.g., plain ascii files). If a file is opened with a specific
233     // encoding (either detected or given explicitly), this setting will be
234     // ignored, and the file will be saved with the encoding it was opened
235     // with.
236     // 默認編碼格式
237     "default_encoding": "UTF-8",
238 
239     // Files containing null bytes are opened as hexadecimal by default
240     // 包含空字節的文件被打開默認爲十六進制
241     "enable_hexadecimal_encoding": true,
242 
243     // Determines what character(s) are used to terminate each line in new files.
244     // Valid values are 'system' (whatever the OS uses), 'windows' (CRLF) and
245     // 'unix' (LF only).
246     // 每一行結束的時候用什麼字符作終止符
247     "default_line_ending": "system",
248 
249     // When enabled, pressing tab will insert the best matching completion.
250     // When disabled, tab will only trigger snippets or insert a tab.
251     // Shift+tab can be used to insert an explicit tab when tab_completion is
252     // enabled.
253     // 設置爲enabled時,在一個字符串間按Tab將插入一個製表符
254     // 設置爲true時,按Tab會根據先後環境進行代碼自動匹配填補
255     "tab_completion": true,
256 
257     // Enable auto complete to be triggered automatically when typing.
258     // 代碼提示
259     "auto_complete": true,
260 
261     // The maximum file size where auto complete will be automatically triggered.
262     // 代碼提示的大小限制
263     "auto_complete_size_limit": 4194304,
264 
265     // The delay, in ms, before the auto complete window is shown after typing
266     // 代碼提示延遲顯示
267     "auto_complete_delay": 50,
268 
269     // Controls what scopes auto complete will be triggered in
270     // 代碼提示的控制範圍
271     "auto_complete_selector": "source - comment",
272 
273     // Additional situations to trigger auto complete
274     // 觸發代碼提示的其餘狀況
275     "auto_complete_triggers": [ {"selector": "text.html", "characters": "<"} ],
276 
277     // By default, auto complete will commit the current completion on enter.
278     // This setting can be used to make it complete on tab instead.
279     // Completing on tab is generally a superior option, as it removes
280     // ambiguity between committing the completion and inserting a newline.
281     // 設爲false時,選擇提示的代碼按回車或點擊能夠輸出出來,但選擇true時不會輸出而是直接換行
282     "auto_complete_commit_on_tab": false,
283 
284     // Controls if auto complete is shown when snippet fields are active.
285     // Only relevant if auto_complete_commit_on_tab is true.
286     // auto_complete_commit_on_tab必須爲true,控制代碼提示的活躍度
287     "auto_complete_with_fields": false,
288 
289     // By default, shift+tab will only unindent if the selection spans
290     // multiple lines. When pressing shift+tab at other times, it'll insert a
291     // tab character - this allows tabs to be inserted when tab_completion is
292     // enabled. Set this to true to make shift+tab always unindent, instead of
293     // inserting tabs.
294     // 設置爲false,使用Shift + tab老是插入製表符
295     "shift_tab_unindent": false,
296 
297     // If true, the copy and cut commands will operate on the current line
298     // when the selection is empty, rather than doing nothing.
299     //複製與剪切的
300     "copy_with_empty_selection": true,
301 
302     // If true, the selected text will be copied into the find panel when it's
303     // shown.
304     // On OS X, this value is overridden in the platform specific settings, so
305     // you'll need to place this line in your user settings to override it.
306     // 選中的文本按Ctrl + f時,自動複製到查找面板的文本框裏
307     "find_selected_text": true,
308 
309     // When drag_text is enabled, clicking on selected text will begin a
310     // drag-drop operation
311     //拖動文本
312     "drag_text": true,
313 
314     //
315     // User Interface Settings
316     //
317 
318     // The theme controls the look of Sublime Text's UI (buttons, tabs, scroll bars, etc)
319     //主題
320     "theme": "Default.sublime-theme",
321 
322     // Set to 0 to disable smooth scrolling. Set to a value between 0 and 1 to
323     // scroll slower, or set to larger than 1 to scroll faster
324     // 滾動的速度
325     "scroll_speed": 1.0,
326 
327     // Controls side bar animation when expanding or collapsing folders
328     // 左邊邊欄文件夾動畫
329     "tree_animation_enabled": true,
330 
331     // Makes tabs with modified files more visible
332     //高亮未保存文件
333     "highlight_modified_tabs": false,
334     // 標籤頁的關閉按鈕
335     "show_tab_close_buttons": true,
336 
337     // Show folders in the side bar in bold
338     //在側邊欄顯示文件夾
339     "bold_folder_labels": false,
340 
341     // OS X 10.7 only: Set to true to disable Lion style full screen support.
342     // Sublime Text must be restarted for this to take effect.
343     //開啓全屏,針對 OS X 10.7
344     "use_simple_full_screen": false,
345 
346     // OS X only. Valid values are true, false, and "auto". Auto will enable
347     // the setting when running on a screen 2880 pixels or wider (i.e., a
348     // Retina display). When this setting is enabled, OpenGL is used to
349     // accelerate drawing. Sublime Text must be restarted for changes to take
350     // effect.
351     //針對OS X,使用OpenGL畫圖,需重啓
352     "gpu_window_buffer": "auto",
353 
354     // Valid values are "system", "enabled" and "disabled"
355     //延遲滾動條
356     "overlay_scroll_bars": "system",
357 
358     //
359     // Application Behavior Settings
360     //
361 
362     // Exiting the application with hot_exit enabled will cause it to close
363     // immediately without prompting. Unsaved modifications and open files will
364     // be preserved and restored when next starting.
365     //
366     // Closing a window with an associated project will also close the window
367     // without prompting, preserving unsaved changes in the workspace file
368     // alongside the project.
369     // 熱退出功能!退出時不會提示是否保存文件,而是直接退出
370     "hot_exit": true,
371 
372     // remember_open_files makes the application start up with the last set of
373     // open files. Changing this to false will have no effect if hot_exit is
374     // true
375     //記憶以前打開的文件
376     "remember_open_files": true,
377 
378     // OS X only: When files are opened from finder, or by dragging onto the
379     // dock icon, this controls if a new window is created or not.
380     //始終在新窗口打開文件,針對OS X
381     "open_files_in_new_window": true,
382 
383     // OS X only: This controls if an empty window is created at startup or not.
384     //在打開程序的時候新建窗口,針對OS X
385     "create_window_at_startup": true,
386 
387     // Set to true to close windows as soon as the last file is closed, unless
388     // there's a folder open within the window. This is always enabled on OS X,
389     // changing it here won't modify the behavior.
390     //當沒有文件時,關閉程序,針對Windows
391     "close_windows_when_empty": false,
392 
393     // Show the full path to files in the title bar.
394     // On OS X, this value is overridden in the platform specific settings, so
395     // you'll need to place this line in your user settings to override it.
396     //在標題欄顯示絕對路徑
397     "show_full_path": true,
398 
399     // Shows the Build Results panel when building. If set to false, the Build
400     // Results can be shown via the Tools/Build Results menu.
401     "show_panel_on_build": true,
402 
403     // Preview file contents when clicking on a file in the side bar. Double
404     // clicking or editing the preview will open the file and assign it a tab.
405     //在側邊欄預覽文件
406     "preview_on_click": true,
407 
408     // folder_exclude_patterns and file_exclude_patterns control which files
409     // are listed in folders on the side bar. These can also be set on a per-
410     // project basis.
411     // 哪些文件會被顯示到邊欄上
412     "folder_exclude_patterns": [".svn", ".git", ".hg", "CVS"],
413     "file_exclude_patterns": ["*.pyc", "*.pyo", "*.exe", "*.dll", "*.obj","*.o", "*.a", "*.lib", "*.so", "*.dylib", "*.ncb", "*.sdf", "*.suo", "*.pdb", "*.idb", ".DS_Store", "*.class", "*.psd", "*.db"],
414     // These files will still show up in the side bar, but won't be included in
415     // Goto Anything or Find in Files
416     "binary_file_patterns": ["*.jpg", "*.jpeg", "*.png", "*.gif", "*.ttf", "*.tga", "*.dds", "*.ico", "*.eot", "*.pdf", "*.swf", "*.jar", "*.zip"],
417 
418     // List any packages to ignore here. When removing entries from this list,
419     // a restart may be required if the package contains plugins.
420     // 刪除你想要忽略的插件,須要重啓
421     "ignored_packages": ["Vintage"]
422 }
View Code

 

接下來就是它的最強項,插件的安裝:
插件的安裝有兩個辦法:

(1)直接把插件放到它的安裝路徑對應文件包packages裏面去,不知道在哪的能夠直接打開 preferences->Browse packages

放進去以後軟件會自動檢測

(2)使用命令方式直接讓軟件本身下載安裝。(使用package control組件)

按下Ctrl+Shift+P調出命令面板,輸入install, 調出 Install Package 選項並回車,而後在列表中選中要安裝的插件。(這一步你要先安裝下面那個package control插件)

 

經常使用插件:

(1)package control

經過快捷鍵 ctrl+` 或者 View > Show Console 菜單打開控制檯

而後粘貼對應的版本代碼進去,而後回車讓它安裝~

適用於 Sublime Text 3:

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())

 

適用於 Sublime Text 2:

 

import  urllib2,os;pf='Package Control.sublime-package';ipp=sublime.installed_packages_path();os.makedirs(ipp)ifnotos.path.exists(ipp)elseNone;urllib2.install_opener(urllib2.build_opener(urllib2.ProxyHandler()));open(os.path.join(ipp,pf),'wb').write(urllib2.urlopen('http://sublime.wbond.net/'+pf.replace(' ','%20')).read());print('Please restart Sublime Text to finish installation')

固然了,有些時候這樣你安裝不進去的,就只能自個去下載安裝包放到package文件裏邊去了(就是上邊我說的那個文件夾)
若是在Preferences → Package Settings 中看到 Package Control 這一項,說明安裝成功。這樣:

 

好了接下來咱們就能夠直接用它來安裝插件了~

(2)舉個例子吧:好比這個插件 Alignment(代碼補齊) 

補齊就是補齊~就像這樣

你能夠去插件庫下載:https://github.com/wbond/sublime_alignment

而後把它放到package文件包中。

若是沒用過Github的朋友不知道在哪裏下載..看這個圖~

而後把它解壓,把文件夾放進package文件包,而後它就能檢測到包啦~體驗一下

 

 

 而後介紹一下命令的方式,鍵入Ctrl+shift+p  輸入install  選擇package install 過幾秒會彈出另外一個框。

而後在輸入框中輸入你想要的插件關鍵字就行,而後就選擇安裝吧~

 大體就是這樣,簡單明瞭。下面介紹其餘經常使用插件,安裝方式同理~

(3)Zen Coding(現已更名爲Emmet) 下載:https://github.com/sergeche/emmet-sublime

zen coding 就是經過簡單的命令直接生成一大段代碼!一個字又快又準~

安裝好插件後,使用Ctrl + Alt + Enter 呼出ZenCoding。

咱們能夠用 div#content>ul>li*3>a[href="javascript:void(0);"]{Links$} 這樣短短的一句話,生成下面一段代碼:

更多的技巧就本身去學學吧~

(4)ColorPicker(調色盤) 下載:https://github.com/weslly/ColorPicker

在編輯CSS樣式的時候,ColorPicker可讓sublime text 內置一個調色盤,調好顏色,點擊OK就會在光標處生成十六進制顏色代碼。

(5)SublimeTmpl(自定義新建文件) 下載:https://github.com/kairyou/SublimeTmpl

  默認已經添加了html、css、js等常見類型的面板,按ctrl+alt+h/ctrl+alt+c/ctrl+alt+j可新建這 3鍾類型的文件,快捷鍵在這裏\Packages\SublimeTmpl\Default (Windows).sublime-keymap, 模板文件在這裏\Packages\SublimeTmpl\templates,可修改。 好比下邊簡單的html文件

(6)

BracketHighlighter高亮顯示匹配的括號、引號和標籤

BracketHighlighter這個插件能在左側高亮顯示匹配的括號、引號和標籤,能匹配的[] ,  () ,  {} ,  "" ,  '' , <tag></tag>等甚至是自定義的標籤,當看到密密麻麻的代碼分不清標籤之間包容嵌套的關係時,這款插件就能很好地幫你理清楚代碼結構,快速定位括號,引號和標籤內的範圍。

 

(7)

還有更多插件,能夠自行去搜索下載~我沒時間了要出去了 T_T...

好比:

其餘插件:

Clipboard-history(粘貼板歷史記錄) 下載:https://github.com/kemayo/sublime-text-2-clipboard-history   

CSScomb(CSS屬性排序) 下載:https://github.com/csscomb/CSScomb-for-Sublime   

Gits(集成 GitHub) 下載:https://github.com/kemayo/sublime-text-git   

Hex-to-HSL-Color Hex(顏色模式轉HSL顏色模式)  下載:https://github.com/atadams/Hex-to-HSL-Color   

HtmlTidy(清理與排版你的HTML代碼)  下載:https://github.com/welovewordpress/SublimeHtmlTidy   

JsFormat(javascript格式化) 下載:https://github.com/jdc0589/JsFormat   

PHPTidy(整理與排版PHP代碼) 下載:https://github.com/welovewordpress/SublimePhpTidy   

SideBarEnhancements(側邊欄加強) 下載:https://github.com/titoBouzout/SideBarEnhancements   

SublimeLinter(代碼錯誤提示) 下載:https://github.com/SublimeLinter/SublimeLinter/tree/sublime-text-3   

SFTP(編輯 FTP 或 SFTP 服務器上的文件) 下載:http://wbond.net/sublime_packages/sftp     

Tradsim(中文繁字體和簡體字轉換) 下載:https://github.com/erinata/SublimeTradsim   

TrailingSpacer(高亮顯示多餘的空格和Tab) 下載:https://github.com/SublimeText/TrailingSpaces   

YUI Compressor(壓縮JS和CSS文件) 下載:https://github.com/kairyou/SublimeYUICompressor

 

---------先到這裏了----------

相關文章
相關標籤/搜索