基礎(chǔ)工具
Sublime Text 3 - 文本編輯器（推薦）
輕量文本編輯器誉券，支持markdown以及多種代碼擴(kuò)展插件，目前最廣泛使用的文本編輯器
Atom - 文本編輯器
Github出品的文本編輯器堰怨，基于Sublime Text 基礎(chǔ)上開(kāi)發(fā)，綜合了各式編輯器特點(diǎn)曙搬，開(kāi)源赴涵，更新頻繁，插件豐富多彩
Visual Studio Code - 代碼編輯器
微軟出品的代碼編輯器订讼，支持markdown及多種代碼語(yǔ)法髓窜，功能類(lèi)似于Sublime Text ，目前更新頻繁，插件較為豐富
WebStorm - JavaScript 代碼編輯器
老牌著名jetbrains出品的系列編輯器之一寄纵，同系列有PhpStorm - php 代碼編輯器鳖敷，支持HTML／CSS ，集成es6等最新的語(yǔ)法標(biāo)準(zhǔn)程拭，支持新框架如Angular JS等定踱，專(zhuān)門(mén)對(duì)JavaScript進(jìn)行了優(yōu)化
插件擴(kuò)展
本部分以Sublime Text 3為例子作為講解，如使用Atom／VS code等請(qǐng)對(duì)應(yīng)參照相應(yīng)的安裝插件擴(kuò)展教程恃鞋，本部分涉及的插件擴(kuò)展都有對(duì)應(yīng)的Atom／VS code版本崖媚，若無(wú)則可以找相近替代
Package Control / 擴(kuò)展包控制工具
Sublime text 3 安裝插件必需前提，為其提供安裝管理功能恤浪。
下載安裝
將官網(wǎng)對(duì)應(yīng)Package Control的安裝包解壓縮到Packages目錄（菜單->preferences->packages）-
在線(xiàn)安裝
調(diào)出console畅哑，鍵入以下代碼之后，重啟Sublime Text生效：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()) 安裝插件
按下Ctrl+Shift+P調(diào)出命令面板水由，輸入install調(diào)出Install Package選項(xiàng)并回車(chē)荠呐，然后在列表中選中要安裝的插件。
Emmet - 代碼快速擴(kuò)展補(bǔ)完
對(duì)按照約定形式的代碼縮寫(xiě)進(jìn)行自動(dòng)擴(kuò)展補(bǔ)完砂客，支持HTML／CSS／JavaScript泥张，觸發(fā)鍵為TAB
例：
div.wrap>((header>p)+(content>a.link{Item $}*3)+(footer>span))
Emmet擴(kuò)展：
<div class="wrap">
<header>
<p></p>
</header>
<content>
<a href="" class="link">Item 1</a>
<a href="" class="link">Item 2</a>
<a href="" class="link">Item 3</a>
</content>
<footer><span></span></footer>
</div>
CSS comb - CSS代碼屬性排序（需要Node.js環(huán)境）
按照屬性類(lèi)別對(duì)CSS代碼進(jìn)行排序
觸發(fā)鍵為Crtl+Shift+C
Js Format - JavaScript代碼格式化
按照通用標(biāo)準(zhǔn)格式化JavaScript代碼
觸發(fā)鍵為Crtl+Alt+F
Autoprefixer - CSS3私有前綴補(bǔ)全
使用CanIUse資料庫(kù)，對(duì)CSS3屬性進(jìn)行自動(dòng)補(bǔ)全
觸發(fā)鍵：Tab
MarkDown Preview - MD語(yǔ)法支持
預(yù)覽MD語(yǔ)法文件鞠值，用于編寫(xiě)MD文檔
SublimeEnhancements - 側(cè)欄增強(qiáng)工具
增強(qiáng)Sublime Text中側(cè)欄的功能媚创，支持工程內(nèi)新建副本／刷新／工程內(nèi)移動(dòng)文件等
觸發(fā)鍵：側(cè)欄視圖中鼠標(biāo)右鍵
Clipboard History - 剪切板歷史記錄
顯示剪切板歷史記錄，方便選擇粘貼
觸發(fā)鍵：
Ctrl+alt+v：顯示歷史記錄
Ctrl+alt+d：清空歷史記錄
強(qiáng)迫癥特供
- Alignment - 代碼對(duì)齊（等號(hào)對(duì)齊齿诉，觸發(fā)鍵為
Crtl+Alt+A）
-
TrailingSpaces - 跟蹤空格（高亮多余空格和Tab）
更多插件
根據(jù)項(xiàng)目／產(chǎn)品需要以及個(gè)人喜好進(jìn)行插件庫(kù)的整理筝野，如使用JQuery／LESS／SASS等可搜尋對(duì)應(yīng)的插件擴(kuò)展使用。
本地開(kāi)發(fā)環(huán)境
wamp
未完待續(xù)
