IDE
集成开发环境(IDE,Integrated Development Environment )是用于提供程序开发环境的应用程序,一般包括代码编辑器、编译器、调试器和图形用户界面等工具。集成了代码编写功能、分析功能、编译功能、调试功能等一体化的开发软件服务套
编写react-native程序,可以根据个人喜好选择不同的编辑器,比如:WebStorm、SublimeText、Atom等,本文要谈到的是Atom
Atom
Atom,是由github团队打造的一款开源免费的代码编辑器。进入到官网点击Download,下载安装即可。
如果用过Sublime Text ,那么可以很容易的掌握Atom的基本用法。Atom提供类似于Package Control的插件机制,可以通过插件管理器安装丰富的插件。
根据react-native中文官网搭建好开发环境后,有一步很重要的工作是安装便于代码编写的插件,以下我将推荐几个很实用的插件。
如何在Atom编辑器中查找并安装插件?
启动Atom,选择Preferences,选择Settings,选择Install
显然稍微麻烦了一点,这里请记住快捷键:command + , 即可快速打开
1、atom-react-native-autocomplete
代码自动补全

2、highlight-selected
选中项高亮

3、autocomplete-paths
文件路径自动提示

4、atom-beautify
代码格式化

5、minimap
类似sublim text右边的代码缩略图。

6、pigments
根据颜色值,在旁边显示一个对应颜色的小图标或者直接显示为背景

7、color-picker
取色器

8、activate-power-mode
代码在跳舞

9、linter和linter-jshint
该插件是用jshint来检查代码,想必大家都听说过jshint代码检查工具,它有一个配置文件.jshintrc,这个文件告诉jshint执行的检查规则。通过jshint能发现代码中存在的问题,可以及时避免bug的发生。linter-jshint插件基于atom规则来使用jshint,该插件可以在项目根目录下新建一个.jshintrc来告诉检查规则,也可以不用创建此文件来进行代码检查。
注意:linter-jshint是依赖linter插件来使用的,也就是说必须先安装linter插件;因为linter是一个粗糙的检查,有很多针对专门项的代码检查,如linter-csslint、linter-php等等

10、terminal-plus
Atom 中有了 terminal-plus 简直可以完全弃用系统控制台了。
cmd+shift+t 开启新控制台
ctrl+` 打开 /关闭 控制台

cmd+shift+j/k 切换控制台

网友评论