ReactNative环境搭建问题小札

直接进入正题...

----------win7系统 + android studio工具

        按照reactnative的官方介绍搭建开发环境 - React Native 中文网,使用Chocolatey,简单方便一些,但是会有一些小问题,不是因为翻墙的问题,python和Yarn、React Native的命令行工具(react-native-cli)没有太大的问题,注意,是没有太大的问题,小问题还是有的

        吃过亏,画个圈...

        建议node.js还是手动安装比较好,使用Chocolatey安装的目录C:\Users\admin\AppData\Roaming,可以修改,具体问百度,但是这个目录属于隐藏文件,在尝试之后,我选择自己下一个

A、下载Node.js,这个找个看的顺眼的下载即可,没有太大难度

      1、 windows的安装msi文件在过程中会直接添加path的系统变量,变量值是你的安装路径,例如我的是“C:\ProgramFiles\nodejs”,如果path中没有,那么需要你自己配置。检测是否安装成功:打开命令行cmd,输入node–v(下图说明,安装成功)

安装成功

    2、npm的安装。由于新版的NodeJS(找新的)已经集成了npm,所以之前npm也一并安装好了。同样可以使用cmd命令行输入"npm -v"来测试是否成功安装。如果没有,回头自己找新的,不然就是自己重新下载

npm成功

        要知道,此刻不是全部,因为并没有成功,我们需要配置"node_global"及"node_cache",第一次安装也是因为这个,扯着dandan了,我们要先配置npm的全局模块的存放路径以及cache的路径,将以上两个文件夹放在NodeJS的主目录下,便在NodeJs(你的安装路径,自己记得)下建立"node_global"及"node_cache"两个文件夹。如下图

新建目录

然后,启动cmd,运行(官网有这两句话,貌似...)

npm config set prefix "C:\Program Files\nodejs\node_global"

npm config set cache "C:\ProgramFiles\nodejs\node_cache"

ps:注意自己的安装路径(C:\ProgramFiles\nodejs)

        然后安装模块,同样在cmd命令行里面,输入“npm install express -g”(“-g”这个参数意思是装到global目录下,也就是上面说设置的“C:\ProgramFiles\nodejs\node_global”里面。)。待cmd里面的安装过程滚动完成后,会提示“express”装在了哪、版本还有它的目录结构是怎样。此时你打开node_global目录,你会发现,文件夹不在是空的了。如果是空的,你可以重新安装或者选择放弃(截图就不放了,有点长)。

        next,关闭cmd,不用管它,然后配置环境

        进入环境变量对话框,在系统变量下新建"NODE_PATH",输入“C:\PrograFiles\nodejs\node_global\node_modules”。新增:由于改变了module的默认地址,所以上面的用户变量都要跟着改变一下(用户变量"PATH"修改为“C:\ProgramFiles\nodejs\node_global\”),要不使用module的时候会导致输入命令出现“xxx不是内部或外部命令,也不是可运行的程序或批处理文件”这个错误。(无碍)

        以上步骤都OK的话,我们可以再次开启cmd命令行,进入node,输入“require('express')”来测试下node的模块全局路径是否配置正确了。正确的话cmd会列出express的相关信息。如下图(如出错一般都是NODE_PATH的配置不对,回头自己去看)


正常

B、安装python和Yarn、React Native的命令行工具(react-native-cli),可以使用Chocolatey,当然也可以自己下载安装,配置环境,这两个没有太大问题,问题一般都出在Node上。

C、安装官网介绍,此刻你可以建一个rn项目(AwesomeProject是项目名字)

                    react-native init AwesomeProject

                    cd AwesomeProject

                    react-native run-android

        当然也可以导入一个项目(android部分),倘若本项目缺少node_modules,只需要在本路径下,打开命令行,输入npm install即可,等到node_modules安装完成,即可在android studio中编译,不过再win环境下,时间相对较长


我的项目运行无误了,你的呢...

参考链接:http://xiaoyaojones.blog.163.com/blog/static/28370125201351501113581/

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

推荐阅读更多精彩内容

  • 尽管在移动开发中,原生APP的开发成本很高,但现阶段基于原生开发仍然是必须的,因为Web的用户体验仍无法超越Nat...
    奔跑的大橙子阅读 5,435评论 0 11
  • 大家好,我是IT修真院深圳分院第3期的学员,一枚正直纯洁善良的前端程序员,今天给大家分享一下,修真院官网前端工程师...
    大大头大阅读 2,988评论 0 1
  • 总学习不练习下怎么行呢,下面对于我们之前学习的东西稍微进行下拓展,做一下简单的几道题看看哈: 1. 说出变量名字,...
    小灰辉先生阅读 688评论 0 0
  • 今天办公室的气氛有点尴尬,起因仅仅因为一把美工刀。 最近工作比较忙,下班后却还要排练年会的舞蹈。所以每天早上我都忙...
    向行阅读 615评论 14 7
  • “最后这几道数学题也太难了吧……”我踢了下前面许安阳的凳子。“诶,许安阳,这几题我不会。” 他...
    北希_ros阅读 173评论 0 1