React Native在Mac上部署iOS开发环境
时间:2022-06-02
本文章向大家介绍React Native在Mac上部署iOS开发环境,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
1.如果Mac上没有安装Homebrew请按如下步骤安装
- 打开终端输入如下代码
ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
- 更新Ruby(版本过低部分组件无法安装)
brew install ruby
2.安装Node.js
在这里我使用的是直接下载安装Node.js: https://nodejs.org/en/download/ 简单方便。
3.安装 watchman 和 flow操作分别执行以下俩代码
brew install watchman
brew install flow
3.安装 React-Native
sudo npm install -g react-native-cli
然后输入开机密码,如果成功会有如下提示
allluckly.cn
到此环境配置完毕,我们创建一个项目试试看,通过如下代码创建
react-native init testProject
testProject 为项目名,可随意,等待 一段时间之后(具体视网络情况而定),项目初始化完成。如果成功则有如下提示
Bison的技术博客
4.进入项目
cd testProject
可以看到如下目录
golddeMac-mini: testProject gold$ ls -l
total 24
drwxr-xr-x 10 gold staff 340 7 27 10:46 android
-rw-r--r-- 1 gold staff 1103 7 27 10:46 index.android.js
-rw-r--r-- 1 gold staff 1069 7 27 10:46 index.ios.js
drwxr-xr-x 5 gold staff 170 7 27 10:46 ios
drwxr-xr-x 5 gold staff 170 7 27 10:46 node_modules
-rw-r--r-- 1 gold staff 238 7 27 10:46 package.json
Bison的技术博客.png
其中 android 和 ios 中分别为两个平台的项目文件。index.android.js 和 index.ios.js 为两个页面对应的 js 文件。
5.运行项目
iOS 还是非常简单,XCode 打开项目,点击运行就好。修改 index.ios.js, 在模拟器中 ⌘ + R 重新载入 js 即可看到相应的变化。
iOS 真机调试也简单,修改HTTP地址即可。
jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle"];
运行成功的效果图如下
Bison的技术博客-iOS开发.png
参考文档:react-native官方文档
有问题欢迎留言,对你有帮助随手点喜欢。后续如果有时间的话,会一直更新学习React Native的一些心得与体会。
- 针对近期“博全球眼球的OAuth漏洞”的分析与防范建议
- 黑掉美国(英国、澳大利亚、法国等)的交通控制系统
- Android 自定义标签 ViewLayout
- Identity Service - 解析微软微服务架构eShopOnContainers(二)
- 机器学习之随机森林
- Catalog Service - 解析微软微服务架构eShopOnContainers(三)
- EventBus In eShop -- 解析微软微服务架构Demo(四)
- Health Check in eShop -- 解析微软微服务架构Demo(五)
- Android Studio相见恨晚的操作锦集
- [收藏]几个常用的用正则表达式验证字符串的函数
- 走进科学: 无线安全需要了解的芯片选型、扫描器使用知识
- React Native之携程Moles框架
- 从Android短信漏洞到手机钓鱼木马
- 老外手把手带你搭建DMZ渗透测试实验室(Part 1,2)
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- Python中的命名空间和作用域(2)
- C/C++可以用正则表达式吗?
- typescript实战总结之实现一个互联网黑白墙
- 文件上传漏洞演示(一句话木马文件 + 蚁剑)
- [Bazel]构建Golang项目
- 2020--IDEA破解失败后无法打开(mac/win)【已解决】
- CPU:别再拿我当搬砖工!
- 7类 登录/注册 安全漏洞
- 安全弹出你的移动设备,保护数据安全!
- burpsuite系列
- idea_Maven_setting文件依赖源国内镜像
- Wapiti安装及使用
- 利用burpsuite+sqlmap POST自动化注入详解
- GSoC: GitHub Checks API 项目第一阶段总结
- GoldenEye靶机渗透