入坑 React Native 之编码工具WebStorm配置

写代码,好的编码工具是必不可少的.经做web前端的同事推荐选用WebStorm,WebStorm是jetbrains公司旗下一款JavaScript开发工具.被广大中国JS开发者誉为"Web前端开发神器".但是好像要收费的,可以考虑下破解版.

配置之前,先把之前创建好的HelloWord项目导入.(未创建项目可以参考上一篇:入坑 React native 之开发环境搭建)


jsx语法设置

JSX (Javascript XML syntax transform) 是使用XML语法编写Javascript的一套解析工具;

X代表XML;也可以理解为扩展(eXtension),因为实现JSX功能本身就是使用Javascript;


File->Default Settings
Languages&Framworks->JavaScript

然后Apply/OK jsx配置完成。

代码自动补全功能配置

点击 WebStorm->Preferences 

快捷键:command+,

进入后Libraries->Download 进行选择需要插件

下载插件

我们就选择react-DefinitelyGTyped,react-native-DefinitelyTyped 即可


下载并安装

Apply/OK 补全代码功能配置完成。

react-native运行方案配置

WebStorm这个IDE直接完成编码+运行项目工作.这样就可以不用打开Xcode了.

npm 基本配置

Edit Configurations

进入配置画面点击+号并选择npm

npm

配置npm, command 写入 help

配置npm

点击 RunExternal tool


添加运行工具

配置信息后 Apply / OK 即可.

配置运行工具

Name:运行按钮的名字, 随便起一个就可以了.

Program: react Native的路径,一般都是  /usr/local/bin/react-native (终端命令:which react-native)

Parameters: run-ios

working directory: 先点击右边的insert macro,选择"ProjectFileDir - The directory of the project file."

运行

点击运行,出现如下画面运行成功.

运行成功


配置已完成

WebStorm 配置完成!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容