React Native 环境配置的坑

一直想试试RN,但是因为安装环境的问题一直没有成功,中间陆陆续续因为时间的原因中断了一段时间,今天终于鼓起勇气再次冲击·····,先说一下我之前安装环境的坑爹史吧。

刚刚开始我是按照下面的按照方法安装的:


1、首先需要安装 Homebrew,安装只要一句话:/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)",判断安装成功与否,可以用命令查看:brew -v。

然后用brew命令来安装Node.js(服务端的JavaScript运行环境):

brew install node

安装完成之后测试是否安装成功,npm -v,如果没有反应那就是安装错了,坑爹的,我在这一步卡死了,因为我这一步安装成功,npm -v也提示版本,但是提示npm not link,所以下面使用npm命令(第3步)的时候就用不了,然后我找啊找找啊找,无数次卸载删除该路径都无效,就在我放弃的时候突然想到,我用其它方法安装,不要用homebrew安装,然后我就去官网下载安装了一个node.js


2、然后安装 watchman(Facebook推出的文件改动监听器):

brew install watchman

React Native通过watchman来监视代码文件的改动并适时进行编译。这就好比Xcode,它会在每次文件被保存时对文件进行编译。


3、然后用npm命令安装React Native 的CLI工具:

npm install -g react-native-cli

如果这条命令出错,试试提一下权限sudo npm install -g react-native-cli

这个命令通过Node Package Manager来下载和安装CLI工具,npm是一个类似CocoPods或Carthage工具。


4、定位到要创建React Native 项目的文件夹,使用CLI工具创建一个新的React Native项目:

react-native init PropertyFinder

这将创建一个默认的React Native项目,其中包含有能够让React Native项目编译运行的必要内容。

在React Native项目文件夹中,有一个node_modules文件夹,它包含React Native 框架文件。此外还有一个 index.ios.js 文件,这是CLI创建的脚手架代码。最后,还有一个Xcode项目文件及一个iOS文件夹,后者会有一些iOS代码用于引导React Navtive App。


5、然后打开iOS文件夹下的Xcode文件你就可以运行啦······\(≧▽≦)/激动·····

建议科学上网,不然下载一些东西会很慢,有好的方法和学习路径希望不吝赐教~~

其它阅读请参考以下:

React Native 官方文档中文版

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏BestSDK

开发微信小程序,必知的40个小技巧

微信小程序开发者和开发需求者必读的40条技巧分享: Q:为什么脚本内不能使用window等对象 A:页面的脚本逻辑是在JsCore中运行,JsCore是一个没有...

5153
来自专栏前端说吧

CSS-三栏响应式布局(左右固宽,中间自适应)的五种方法

3313
来自专栏禅林阆苑

小程序开发总结01 - 模块化开发流程规范

H5 的开发涉及开发工具、前端框架、模块管理工具、任务管理工具、UI库、接口调用工具、各种浏览器运行环境等,尽管H5丰富的开发环境给了开发者更加灵活的配置方案,...

1767
来自专栏我和未来有约会

在创建的Silverlight Control中使用图片

在创建的Silverlight Control中使用图片  在做控件的Template的时,有可能需要用到位图。但是直接把图片放到ControlTempla...

2764
来自专栏.Net移动开发

Smobiler 4.0 正式发布

773
来自专栏君赏技术博客

怎么让APP`iTunes Connect`名字和在设备上显示的名字是一致的

在iTunes Connect和设备上显示的名字是一致的,因为避免混淆。对于WatchKit的app,对于WatchKit应用程序,这意味着在iTunes Co...

2383
来自专栏美丽应用

为安卓Chrome加入自定义手势控制

6753
来自专栏娱乐心理测试

40条微信小程序技巧分享

1453
来自专栏IMWeb前端团队

Webpack实战-构建同构应用

本文作者:IMWeb 吴浩麟 原文出处:IMWeb社区 未经同意,禁止转载 image.png 同构应用是指写一份代码但可同时在浏览器和服务器中...

2696
来自专栏陈纪庚

css加载会造成阻塞吗?

终于考试完了,今天突然想起来前阵子找实习的时候,今日头条面试官问我,js执行会阻塞DOM树的解析和渲染,那么css加载会阻塞DOM树的解析和渲染吗?所以,接下来...

1191

扫码关注云+社区