開發(fā)工具

文本編輯器

• Sublime Text
• Notepad++
• EditPlus

IDE(集成開發(fā)環(huán)境)

• WebStorm
• IntelliJ IDEA
• Eclipse

Sublime Text優(yōu)點(diǎn)

• Sublime Text輕量級(jí)開發(fā)工具，跨平臺(tái)，啟動(dòng)快
• 多行選擇
• 各種實(shí)用插件
• Snippets可以新建代碼片段
• 支持VIM兼容模式

Sublime Text常用快捷鍵

• 查找（Ctrl+P)
  舉例子：1、輸入當(dāng)前項(xiàng)目中的文件名，快速搜索文件，2、輸入@和關(guān)鍵字，查找文件中函數(shù)名(ctrl+r)，3、輸入：和數(shù)字，跳轉(zhuǎn)到文件中該行代碼(ctrl+g)4、輸入#和關(guān)鍵字，查找變量名(ctrl+;)。
• 命令面板 （Ctrl+Shift+P）
  舉例子：1、輸入sider 可以選擇view:Toggle Sider Bar打開或關(guān)閉側(cè)邊欄
• 多行選擇（Ctrl+D,Ctrl+Shift+L）
• 全部選擇 （Alt+F3）

常用插件

• Package Control
  package 管理工具，通過這個(gè)插件可以添加、卸載其他的插件。
  安裝地址:https://packagecontrol.io/ ,打開View -> Showconsole (ctrl+`)，輸入復(fù)制過來的安裝命令。
• Emmet
  可以快速的編寫html和css代碼
  具體安裝方法：1.Ctrl+shift+p 輸入PCI 2.選擇Package Control:Install Package
  3.等待輸入安裝插件的名稱，提示中會(huì)出現(xiàn)，選擇安裝。4.重啟Sublime。
• DocBlockr
  可以方便產(chǎn)生函數(shù)的注釋
• SideBarEnhancements
  右鍵菜單增強(qiáng)工具
• Termail
  在Sublime中可以直接打開命令行終端

實(shí)踐操作

• 1.新建Html文件
  Ctrl+n (新建) -> ctrl+shift+p (命令面板) 中輸入ssh(設(shè)置新建文件的類型) ->選擇 set syntax:html -> 輸入 "!"后按 "Tab "鍵，就可以生成一個(gè)Html文件的框架了。
• 2.html代碼書寫的快捷方式
  例如：輸入 div>#nav>ul>li*4>a 后按 tab 鍵，后生成代碼

<div id="nav">
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</div>

• 3.添加JS的注釋模板

Snippets 代碼片段

• tools -> New Snippets (新建代碼片段)

<snippet>
    <content><![CDATA[
Hello,world!
]]></content>
    <!-- 代碼片段的關(guān)鍵字，
    Optional: Set a tabTrigger to define how to trigger the snippet -->
    <tabTrigger>hello</tabTrigger>
    <!-- 代碼片段適用的范圍，
    Optional: Set a scope to limit where the snippet will trigger -->
    <scope>source.html</scope>
</snippet

開啟VIM兼容模式

• Preferences -> settings user

{
    "font_size": 11,
    "ignored_packages":
    [

    ]
}

Sublime text 快捷鍵補(bǔ)充

Ctrl+N 新建窗口
Ctrl+/ 注釋整行（如已選擇內(nèi)容，同“Ctrl+Shift+/”效果）
Ctrl+Shift+c轉(zhuǎn)換為utf8
Ctrl+R 搜索指定文件的函數(shù)標(biāo)簽
Ctrl+G 跳轉(zhuǎn)到指定行
Ctrl+KT 折疊屬性
Ctrl+K0 展開所有
Ctrl+T 詞互換
Ctrl+U 軟撤銷
Ctrl+W 關(guān)閉當(dāng)前編輯窗口
Ctrl+X 刪除當(dāng)前行
Tab 縮進(jìn) 自動(dòng)完成
Shift+Tab 去除縮進(jìn)
Ctrl+Enter 光標(biāo)后插入行
Ctrl+F2 設(shè)置書簽
F2 下一個(gè)書簽
Shift+F2 上一個(gè)書簽
shift+鼠標(biāo)右鍵 列選擇
Alt+F3 選中文本按下快捷鍵，即可一次性選擇全部的相同文本進(jìn)行同時(shí)編輯
Alt+. 閉合當(dāng)前標(biāo)簽
F6 檢測(cè)語法錯(cuò)誤
F9 行排序(按a-z)
F11 全屏模式
Ctrl+Shift+Enter 光標(biāo)前插入行
Ctrl+Shift+[ 折疊代碼
Ctrl+Shift+] 展開代碼
Ctrl+Shift+↑ 與上行互換
Ctrl+Shift+↓ 與下行互換
Ctrl+Shift+A 選擇光標(biāo)位置父標(biāo)簽對(duì)兒
Ctrl+Shift+D 復(fù)制光標(biāo)所在整行，插入在該行之前
ctrl+shift+F 在文件夾內(nèi)查找，與普通編輯器不同的地方是sublime允許添加多個(gè)文件夾進(jìn)行查找
Ctrl+Shift+K 刪除整行, 同Ctrl+X
Ctrl+Shift+L 鼠標(biāo)選中多行（按下快捷鍵），即可同時(shí)編輯這些行
Ctrl+Shift+M 選擇括號(hào)內(nèi)的內(nèi)容（按住-繼續(xù)選擇父括號(hào)）
Ctrl+Shift+P 打開命令面板
Ctrl+Shift+/ 注釋已選擇內(nèi)容
Ctrl+Shift+Enter 光標(biāo)前插入行
Ctrl+PageDown 、Ctrl+PageUp 文件按開啟的前后順序切換
Ctrl+鼠標(biāo)左鍵 可以同時(shí)選擇要編輯的多處文本
Shift+鼠標(biāo)右鍵（或使用鼠標(biāo)中鍵）可以用鼠標(biāo)進(jìn)行豎向多行選擇
Alt+Shift+1~9（非小鍵盤）屏幕顯示相等數(shù)字的小窗口