sublime 插件安裝

<meta charset="utf-8">

  • 設(shè)置空格可視化

1、菜單欄Preferences->Settings - Default打開默認(rèn)設(shè)置;

2、拷貝默認(rèn)設(shè)置中"draw_white_space": "selection",到Preferences->Settings - User并改為"draw_white_space": "all",保存

  • 設(shè)置tab轉(zhuǎn)換為4個空格

1、菜單欄Preferences->Settings - Default打開默認(rèn)設(shè)置;

2、拷貝默認(rèn)設(shè)置中"translate_tabs_to_spaces": false,到Preferences->Settings - User并改為"translate_tabs_to_spaces": true,保存

  • 創(chuàng)建PHP編譯系統(tǒng)

添加 PHP 的 build system,Tools->Build System-> New Build System :

新建一個,默認(rèn)的內(nèi)容是:

{ "shell_cmd": "make"}

修改為:

{ "cmd": ["php", "$file"], "file_regex": "php$", "selector": "source.php" }

保存在默認(rèn)的目錄下即可,注意修改文件名為 php.sublime-build 。

重啟sublime text,就可以用Ctrl+B來編譯.php文件了;

  • 配置

點擊preferences-setting user,個人設(shè)置如下:

{

//字體大小

"font_size": 13.0,

//字體類型

"font_face": "Consolas",

// 設(shè)置每一行到頂部,以像素為單位的間距,效果相當(dāng)于行距

"line_padding_top": 2,

// 設(shè)置每一行到底部,以像素為單位的間距,效果相當(dāng)于行距

"line_padding_bottom": 2,

// html和xml下突出顯示光標(biāo)所在標(biāo)簽的兩端,影響HTML、XML、CSS等

"match_tags": true,

// 是否顯示代碼折疊按鈕

"fold_buttons": true,

// 代碼提示

"auto_complete": true,

// 默認(rèn)編碼格式

"default_encoding": "UTF-8",

// 左邊邊欄文件夾動畫

"tree_animation_enabled": true,

//刪除你想要忽略的插件

"ignored_packages":

[

"Vintage",

"YUI Compressor"

]}

  • 插件設(shè)置:

左上角Sublime Text -> Preferences -> Package Settings ->插件名 如果沒有最后的"插件名"選項,說明你還沒有安裝此插件。

這里面一般有5個選項:

  • Settings- Default
  • Settings- User
  • Key Bildings - Default
  • Key Bildings - User

帶有后綴Default的,為默認(rèn)設(shè)置,每次升級插件都會重置這里的設(shè)置。所以盡量不要修改這里,否則升級會丟失你原先的設(shè)置。

帶有后綴User的,為用戶自定義設(shè)置,你可以把Default里面的設(shè)置全部復(fù)制一份到這里,然后再修改,這里存在的設(shè)置選項會覆蓋Default里面的,即User的優(yōu)先級更高。

Key Bildings為快捷鍵設(shè)置,默認(rèn)的快捷鍵很有可能因為和其他快捷鍵沖突而無效, 所以可以在Key Bildings - User里重新設(shè)置(格式可以仿照Default里的寫法)。


  • AutoFileName——自動補全文件路徑
j20m809hdgz.jpeg
  • Sidebar——側(cè)邊欄擴展

更多的右鍵選項

  • Sublime?Linter——代碼檢測工具
1522312164612.jpg

這個插件最近才為SublimeText3重建和發(fā)布。新版本顯然帶來了很多新的有所不同的功能,而不是簡單地把所有的Linter 放在一個包中,開發(fā)者允許用戶在升級時選擇并安裝自己經(jīng)常使用的Linter。很明顯,這可以節(jié)省磁盤空間?!案嗟亩ㄖ啤?,這對用戶是很友好的。

  • AllAutocomplete——代碼自動補全

傳統(tǒng)的Sublime Text自動補全插件僅僅在當(dāng)前文件下工作。AllAutocomplete 可以搜索全部打開的標(biāo)簽頁,這將極大的簡化開發(fā)進程。當(dāng)然,還有一個插件叫 CodeIntel, 實現(xiàn)了一些IDE的功能并且為一些語言提供了“代碼情報”: JavaScript, Mason, XBL, XUL, RHTML, SCSS, Python, HTML, Ruby, Python3, XML, Sass, XSLT, Django, HTML5, Perl, CSS, Twig, Less, Smarty, Node.js, Tcl, TemplateToolkit, PHP.

3.jpg
  • Alignment——代碼對齊插件;

由于Ctrl+Alt+A可能跟某IM截圖的快捷鍵沖突,修改Sublime Text 2快捷鍵的方法如下:

打開 Preferences=>Package Settings=>Alignment=>Key Bindding - User然后寫入

<colgroup><col style="width: 72px;"><col style="width: 720px;"></colgroup>

[

{ "keys": ["ctrl+alt+f"], "command": "alignment" }

]
4.jpg

或者改成其他不沖突的快捷鍵即可

  • Bracket?Highlighter——括號高亮匹配;

插件用途:該插件用于高亮顯示成對匹配的括號、引號或其它符號、標(biāo)記,并可對匹配的一對符號之間的內(nèi)容進行操作(這是關(guān)鍵功能)。

通過在用戶定義的鍵盤映射文件中設(shè)置該插件的快捷鍵,可實現(xiàn)以下常用功能:

  • 跳轉(zhuǎn)到左側(cè)括號的右端(或右側(cè)括號的左端);
  • 選擇匹配的一對括號內(nèi)的文本,可選是否包含括號;
5.jpg
  • 選擇 HTML/XML 標(biāo)簽的標(biāo)簽名 (開始標(biāo)簽和閉合標(biāo)簽都會被選中,便于修改);
  • 選擇光標(biāo)所在處的屬性及對應(yīng)的值 (光標(biāo)必須在屬性處,不能超出單詞的最左或最右側(cè));
  • 折疊 / 展開一對匹配的括號內(nèi)的文本;
  • 用快捷面板中的括號將所選擇的代碼段括起來(用 Visual Studio 寫 C# 代碼時就有相同的功能)。

打開和折疊代碼的某一部分就應(yīng)該是這個樣子的。

6.jpg
  • Emmet——快速編寫HTML/CSS
7.jpg
8.jpg

編輯器中最流行的插件之一。Emmet,前身Zen Coding也是web開發(fā)者提高生產(chǎn)力最有效的方法之一。按下Tab鍵,Emmet就能把一個縮寫展開成一個HTML和CSS代碼塊.

概括地說,Emmet是一個可以讓你更快更高效地編寫HTML和CSS,節(jié)省你大量時間的插件。怎么使用?你只需按約定的縮寫形式書寫而不用寫整個代碼,然后按“擴展”鍵,這些縮寫就會自動擴展為對應(yīng)的代碼內(nèi)容。 比如,你只需要輸入

((h4>a[rel=external])+p>img[width=500 height=320])*12

然后它會被擴展轉(zhuǎn)換成12個列表項和緊隨其后的圖像。然后你就可以在此基礎(chǔ)上再填寫內(nèi)容,就這么簡單。

  • DocBlockr——自動注釋生成

如果你遵循的編碼的風(fēng)格很嚴(yán)格,這款插件能夠使你的任務(wù)更容易。DocBlokr 幫助你創(chuàng)造你的代碼注釋,通過解析功能,參數(shù),變量,并且自動添加基本項目。

DocBlockr這個插件可以很好的生成js ,php 等語言函數(shù)注釋,只需要在函數(shù)上面輸入/** ,然后按tab 就會自動生成注釋

9.jpg
  • ColorPicker——取色插件

通常,如果我們需要一個調(diào)色盤的時候,我們習(xí)慣使用Photoshop或是Gimp。但是一個完整的選色工具可以直接在你的編輯器中使用- Ctrl/Cmd + Shift + C。還有兩個插件 GutterColorColorHighlightergutter可以在gutter中顯示很棒的色彩高亮,簡化了色彩代碼的定位。

10.jpg
  • WordCount——可以實時顯示當(dāng)前文件的字?jǐn)?shù)。
11.jpg

安裝后,后下角多出字?jǐn)?shù)

  • EncodingHelper——設(shè)置顯示當(dāng)前文件的編碼類型

Sublime Text 默認(rèn)沒有提供查看當(dāng)前文件的編碼類型,在開發(fā)中經(jīng)常會遇到編碼問題,查看不直觀;

EncodingHelper插件提供了這個功能,安裝即可;


12.jpg

安裝后,后下角多出編碼類型

  • Color Sublime——
13.jpg
  • ChineseLocalizations——漢化

卸載插件:

shift+ctrl+P

14.jpg
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容