正文
react native(以下简称rn)开发工具的文章很多,几乎千篇一律都是copy的(一毛一样),本文结合自己的实践经历,推荐给coder最实用的rn开发工具,rn开发工具用这一篇足矣!
概述:开发rn的工具有很多,选择性也比较多,比如facebook专门为react开发的ide:nuclide,还有做前端比较熟悉的webstorm、sublime text 3、vs code等。
面对这些ide我们应该怎么选择的呢?先说不推荐ide排行榜:
top1:nuclide虽然是facebook专门为react开发的,但依托于atom的nuclide真是慢的出奇,性能低到无法让人忍受,如果你觉得自己是一个好性子,不妨验证一番。
top2:webstorm这个工具对于我来说是非常熟悉的ide从几年前开始开发nodejs一来一直使用的此ide,他的缺点是慢、卡、容易崩溃,而且是收费的,虽然可以破解但对于没有用过的人来说,门槛也不低,但重要的是它的不稳定性崩溃和加载启动的速度着实让人不满意。
说完了不推荐使用的ide,下来说说咱们的重点推荐ide排行榜:
top 1:sublime text 3启动和关闭的速度简直快的像打开text文本一般,当装完插件之后也好用的可以上天,下面说说具体的使用以及插件安装和优化。
1.下载地址:
2.安装package control
win系统可以使用“ctrl+`”快捷键或者通过view->show console菜单打开命令行,粘贴如下代码:
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())
3.安装需要用到的插件
打开sublime text3 ,win系统可以使用快捷键ctrl+shift+p 打开或者,点击菜单栏的“preferences”-->"package control"
打开的终端窗口,输入“install”,下方就会提示“package control:install package”,用鼠标点击,后输入要安装的插件:
reactjs:支持react开发,代码提示,高亮显示
emmet:前端开发必备
terminal:在sublime中打开终端并定位到当前目录
react-native-snippets:react native 的代码片段
jsformat:格式化js代码
其中要单独设置的是jsformat可以设置为保存时自动格式化,设置如下:打开preferences -> package settings -> jsformat -> setting - users,输入以下代码:
{
"e4x": true,
// jsformat options
"format_on_save": true,
}
效果如图:
top 2:vs code
1.下载地址:
2.添加rn开发插件
react native tools:微软官方出的reactnative插件,非常好用
reactjs code snippets:react的代码提示,如componentwillmount方法可以通过cwm直接获得
auto close tag:自动闭合标签
auto rename tag:自动重命名标签,配合上面的插件使用,基本上能赶上intellij idea系的功能了
path intellisense:文件路径提示补全
3.常用快捷键&设置
shift + alt + f:格式化代码
ctrl + space:代码提示,与输入快捷键冲突所有使用不了,可根据自己喜爱自行设置,设置:文件 => 首选项 => 键盘快捷方式 => 搜索“space”=>修改为自己的快捷键,如图:
以上就是reactnative开发工具的详细介绍的详细内容。