以前开发react native项目总是需要打开WebStorm编写代码,Xcode跑项目.显得有点多余.

今天教大家如何直接使用WebStorm这个IDE直接完成编码+运行项目工作.这样就可以不用打开Xcode了.

1.首先点击WebStorm右上方的下拉箭头弹出的Edit Configurations....

2.然后会进入一个配置页面.点击左上方的+.在弹出的列表中选中npm.如图.

3.在右边的配置框中,先选择Command为help.接着点击下方的+号.再点击Run External tool.

4.在弹出框中选择+号.

5.在弹出的配置框中,填写相应信息.

Name为该按钮的名字

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

Parameters填 run-ios

working directory该输入框中,先点击右边的insert macro,选择ProjectFileDir.

.

5.点击OK.接下来点击Apply回到主界面.可以看见右上方的按钮.点击即可运行项目了.

有时,需要更换不同的机型看看运行效果,这时,需要先切换至Terminal.然后敲入相应命令:

如:

react-native run-ios --simulator "iPhone 5"

WebStorm里面配置运行React Native的方案的更多相关文章

  1. Webstorm配置运行React Native

    Webstorm配置运行React Native 1.选择配置 2.选择npm,设置package等参数 3.添加拓展工具 4.配置拓展工具(核心啊) 5.运行测试,ok的.

  2. 安装android Studio和运行react native项目（基础篇）

    ANDROID_HOME环境变量 确保ANDROID_HOME环境变量正确地指向了你安装的Android SDK的路径. 打开控制面板 -> 系统和安全 -> 系统 -> 高级系统设 ...

  3. 运行React Native项目出现白屏,无法运行

    运行React Native出现白屏,无法运行,查看终端报错如下: 原因: 代码中有语法错误,导致运行失败. 其实到这里可以去Xcode查看控制台打印,会提示哪个文件出现错误的. 解决办法: 找到报错 ...

  4. Mac电脑配置IOS React Native开发环境配置笔记

    React Native(以下简称RN)的开发环境配置直接参考官方文档即可完成,不过对小白来说东西有点多,有些名词不是很好理解,这里就官方的安装文档稍微展开说一下. 中文版配置说明:不错的中文说明.官 ...

  5. WebStorm开发工具设置React Native智能提示

    最近在做React Native开发的时候,相信大家一般会使用WebStorm,Sublime,Atom等等开发工具.二之前搞前端的对WebStorm会很熟悉,WebStorm最新版是WebStorm ...

  6. Mac运行React Native安卓项目报错解决

    传送门参考: 下面的这个链接很详细了,一步一步就好.... https://github.com/NARUTOyuyang/React-Native 然而在运行react-native run-and ...

  7. 安装android Studio和运行react native项目（跳坑篇）

    1.需配环境变量,值为sdk的地址. ANDROID_HOME  值:E:\Users\HP\AppData\Local\Android\sdk 2.下载gradle-2.14.1-all.zip 包 ...

  8. 我们一起学React Native(一)：环境配置

    最近想在项目中实现跨平台,对比一下主流的实现方式,选用了React Native.参考网上的教程,对于一直都是原生移动端开发,对前端的知识不是很了解的,感觉入门不是特别简单.于是打算把学习React ...

  9. 史上最全Windows版本搭建安装React Native环境配置

    史上最全Windows版本搭建安装React Native环境配置 配置过React Native 环境的都知道,在Windows React Native环境配置有很多坑要跳,为了帮助新手快速无误的 ...

随机推荐

  1. java基本输入输出练习

    java获取用户的输入分两种,一种是字符的输入,一种是整行的输入,要用到java.io包.对于字符输入来说,使用System.in方法可以输入字符:对于整行的输入,可以使用Scanner类的方法获取整 ...

  2. Json.net 常用使用小结

    using System; using System.Linq; using System.Collections.Generic; namespace microstore { public int ...

  3. Maven学习链接

    别人的资料很多且写的很详细,我这里先收藏,等学习到一定阶段且有时间再整理自己的积累. 1.eclipse安装maven插件方法: http://blog.csdn.net/kittyboy0001/a ...

  4. Android 判断字符串是否为空

    TextUtils.isEmpty(str) 可以判断字符串是否为null或者"",当是的时候为true,否的时候为false

  5. HTML标签-【fieldset】-fieldset

    <fieldset style="width: 400px; height: auto; margin: 10px auto"> <legend>用户基本信 ...

  6. silk mpu

    #include "mpu.h" #include "mbuf.h" #include "media_buffer.h" #include ...

  7. TFS Workspace 更改电脑名称

    不小心改了计算机名称 导致VS在保存项目的时候,包如下错误: 解决方法: 第一步: 第二步:输入如下片段 tf workspaces /updateComputerName:旧计算机名称  /coll ...

  8. 将已有项目提交到github/从github上pull到本地

    去自己的工作分支$ git checkout work 工作.... 提交工作分支的修改$ git commit -a 回到主分支$ git checkout master 获取远程最新的修改,此时不 ...

  9. win环境 yii2 框架 overtrue/wechat 包 由 sys_get_temp_dir 引发的 the directory "c:\Windows" is not writable

    vendor\overtrue\wechat\src\Foundation\Application.php registerBase 方法 在初始化属性时 $this['cache'] = funct ...

  10. serialize和unserialize函数

    序列化是将变量转换为可保存或传输的字符串的过程:反序列化就是在适当的时候把这个字符串再转化成原来的变量使用.这两个过程结合起来,可以轻松地存储和传输数据,使程序更具维护性.1. serialize和u ...