Sublime Text3关于react的插件——react语法

背景: 最近因为项目准备迁移切换技术栈到react~所以研究了一波sublime关于react的插件，很多推荐已经写得很详细，这里就补充一下语法提示和代码格式化的插件。

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格式化，但是因为某些特殊字符处一定会有换行让人难以接受，例如import时：

jsformat格式化后

类似的问题会导致代码校验时无法通过，并且在代码简洁程度上也让人难以接受。而sublime-jsfmt能够帮助搞定这个问题。上图格式化后会变成如下效果：

jsfmt格式化后效果

所以这里强烈推荐安装sublime-jsfmt。

安装方法：

1.打开命令面板Package Control: Install Package -> 输入jsfmt选中。

2.修改设置Preferences -> Package Settings -> Sublime JSFMT：

代码复制请到sublime-jsfmt Setting中

3.设置代码快捷键：

a. Preferences -> Key Bindings - User

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

设置后即可选中代码再通过快捷键格式化代码~

其他的ES6、React.js、jsx代码高亮等可以参见Sublime Text 3 搭建 React.js 开发环境