[React Native]IDE-VSCode

作者: zhuhf | 来源:发表于2016-04-18 22:36 被阅读5773次

    本文的前提是你已经配置好了React Native的环境,还不熟悉的朋友请先移步这里

    上一篇文章我们介绍了WebStorm的安装和使用。本来我不打算介绍VSCode了,后来试用了下,发现VSCode对于编写ReactNative程序来说真的非常适合(目前来说),因为他有快捷的部署能力(react-native run android、react-native start等命令)和良好的ReactNative插件支持,我们看一张演示图

    react-features.gif
    VSCode安装步骤(Windows)

    . 官方网站下载安装包,点击默认安装即可
    . 安装vscode-react-native插件

    1. 按下 F1 键,出现图示的输入框
    2. 删除>符号,输入 ext install react-native,按下回车键,点击图2红色区域的按钮耐心等待即可(鼠标移除VSCode你会发现输入框没了,不用担心,安装好了会提示你的~这点真够恶心,导致我几次都以为不在下载,这点差评!)
    3. 安装好了会提示你重启,点击立即重启,如图3
    图1 图2 图3
    . 调试
    导入React-Native项目,这边以react-native-gitfeed为例
    1.安装调试环境,依次点击图4的步骤,选择React Native,会发现图4三角箭头右边的提示出现Debug Android,如图5 图4 图5
    2.点击图5安装应用到手机或者模拟器(如果没有Debug Android,可以通过F1键,打开输入框,输入react开头,如图6,选择 React Native Run Android 来部署应用,成功之后再选择 React Native Start Packager 来开启服务) 图6

    这样应用就会安装到你的手机上了,接下来我们就可以直接调试我们的应用啦~

    相关文章

      网友评论

      • 5ec1da87f063:我选择环境为何看不到react native?
      • 大号鱼骨头:我用vscode跑不起来。[Error] "Could not debug. Unable to set up communication with VSCode react-native extension. Is this a react-native project, and have you made sure that the react-native npm package is installed at the root?"报这个错误,好奇怪,是因为nodejs的版本不对,ps我这是iOS项目。
      • MR_詹:启动安卓模拟机调试需要准备做什么,我进行安卓模拟机调试一直都不成功
      • Jsonzhang:楼主,你好,我的没有出现debug android ,按照你说的“选择 React Native Run Android 来部署应用”,提示错误,求指导
        zhuhf:@Mrzhangsl 可能需要关闭再打开。
      • zhuhf:智能提醒没看懂官方的配置说明,有知道的可以分享下。
        lyzaijs:@hiphonezhu http://www.jianshu.com/p/a8ffb90b535f

      本文标题:[React Native]IDE-VSCode

      本文链接:https://www.haomeiwen.com/subject/njpalttx.html