背景: 最近因?yàn)轫?xiàng)目準(zhǔn)備遷移切換技術(shù)棧到react~所以研究了一波sublime關(guān)于react的插件，很多推薦已經(jīng)寫得很詳細(xì)，這里就補(bǔ)充一下語法提示和代碼格式化的插件。

1.sublime-react-es6：?react ?es6?語法提示

同sublime-react一樣，作為react語法提示，但是sublime-react-es6支持es6語法。

安裝：

1.安裝Sublime? Package Manager。通過命令行打開: ?+shift+p（MacOS/Linux）

2.輸入install, 選中Package Control: Install Package

3.輸入React, 選中React ES6 Snippets

安裝以后即可使用，如圖所示：

其他代碼段提示參見github：sublime-react-es6

2.sublime-jsfmt?：jsx語法代碼格式化

雖然HTML-CSS-JS Prettify和jsformat都支持jsx格式化，但是因?yàn)槟承┨厥庾址幰欢〞?huì)有換行讓人難以接受，例如import時(shí)：

jsformat格式化后

類似的問題會(huì)導(dǎo)致代碼校驗(yàn)時(shí)無法通過，并且在代碼簡潔程度上也讓人難以接受。而sublime-jsfmt能夠幫助搞定這個(gè)問題。上圖格式化后會(huì)變成如下效果：

jsfmt格式化后效果

所以這里強(qiáng)烈推薦安裝sublime-jsfmt。

安裝方法：

1.打開命令面板Package Control: Install Package -> 輸入jsfmt選中。

2.修改設(shè)置Preferences -> Package Settings -> Sublime JSFMT：

代碼復(fù)制請到sublime-jsfmt Setting中

3.設(shè)置代碼快捷鍵：

a. Preferences -> Key Bindings - User

b.添加配置： ? {"keys":["ctrl+q"],"command":"format_javascript"}

設(shè)置后即可選中代碼再通過快捷鍵格式化代碼~

其他的ES6、React.js、jsx代碼高亮等可以參見Sublime Text 3 搭建 React.js 開發(fā)環(huán)境