標(biāo)簽： 前端工具
其他常用的插件
- All autocomplete： 根據(jù)已打開文件的關(guān)鍵字來補(bǔ)全
- AutoFileName： 自動補(bǔ)全文件名
- BracketHighLighter： 突出顯出括號
- DocBlockr: 寫文檔注釋必備
- EditorConfig： 編輯器環(huán)境統(tǒng)一配置文件
- Emmet： 編寫HTML CSS的神器壳坪，需要學(xué)它的語法
- Gist ：與自己的gist庫連接，需要權(quán)限
- SidebarEnhancement： 側(cè)邊欄增強(qiáng)
- SyncedSidebar： 根據(jù)文件自動打開左邊目錄樹
- todopreview: 查看所有TODO注釋
SublimeLinter-contrib-eslint
eslint是語法檢查的工具悔醋，需要用到npm，安裝過程如下:
1.首先全局安裝eslint绪氛，后面那個是支持es6
npm i -g eslint babel-eslint eslint-plugin-react
2.然后sublime3安裝插件(貌似只有st3支持)
package install進(jìn)入安裝界面,安裝SublimeLinter-contrib-eslint
如果沒有sublimeLinter還要安裝它SublimeLinter懂傀。
3.sublime安裝babel
打開一個js文件設(shè)置view->syntax->open all with extension as->babel->javascript
4.設(shè)置SublimeLinter路徑
Preference->Package Setting->SublimeLinter->User Setting
...
"paths": {
"linux": [],
"osx": [],
"windows": ["C:\\Users\\Administrator\\AppData\\Roaming\\npm"]
},
...
tips: 參看這個
5.設(shè)置.eslintrc
項(xiàng)目根目錄上新建文件.eslintrc,它是長這個樣子的
module.exports = {
"parser": "babel-eslint",
"env": {
"browser": true,
"es6": true,
"mocha": true,
},
"extends": "eslint:recommended",
"parserOptions": {
"ecmaFeatures": {
"ecmaVersion": 6,
"experimentalObjectRestSpread": true,
"jsx": true
},
"sourceType": "module"
},
"plugins": [
"react"
],
"rules": {
"indent": [
"error",
"tab"
]
}
}
詳細(xì)設(shè)置可以參考官方
或者這篇文章 eslint配置參數(shù)介紹
這篇文章更詳細(xì)
現(xiàn)在應(yīng)該能夠用了流强，不能用的話可以先用命令行試下eslint file看看有沒有報(bào)錯。
Floobits
結(jié)對編程的工具激捏，可以實(shí)時同步兩臺機(jī)器的代碼设塔，支持sublime text, atom等編輯器≡毒耍可以免費(fèi)使用闰蛔。
floobits官網(wǎng)
安裝：很簡單的，看官網(wǎng)图柏，不多說了序六。
使用：以sublime為例，兩臺機(jī)注冊兩個號蚤吹，然后一臺share workspace創(chuàng)建倉庫例诀，另一臺join workspace加入倉庫随抠，代碼權(quán)限可以上官網(wǎng)搞，之后就可以兩臺機(jī)一起敲代碼了繁涂，挺好玩的拱她。
注意： 每次打開編輯器都要join workspace登錄倉庫來進(jìn)行實(shí)時同步。
Emmet LiveStyle
前端頁面編寫的福音叭幼铩１印！矿酵！
樣式實(shí)時預(yù)覽工具唬复，不刷新頁面，實(shí)時更新頁面樣式全肮，支持瀏覽器與編輯器的雙向綁定敞咧，也就是說瀏覽器上的修改也會寫到編輯器上。同時也支持遠(yuǎn)程調(diào)試辜腺。一個字休建，神器！目前有chrome和sublime的插件哪自。
使用超級簡單丰包，下載安裝就可以用了。
