React Native for Android 学习笔记（一） 操蛋的环境搭建与demo运行

最新推荐文章于 2024-07-29 15:45:14 发布
最新推荐文章于 2024-07-29 15:45:14 发布
阅读量8.3k 收藏 4
点赞数
文章标签： ReactNative android 环境搭建
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zys871228/article/details/50732604
版权
本文详细记录了在Mac环境下搭建React Native Android开发环境的过程，包括使用Homebrew安装Node.js，安装nvm，watchman和flow，创建并运行AwesomeProject Demo时遇到的Build Tools版本、lint错误和JS bundle加载问题，以及解决这些问题的方法，如修改build.gradle文件，创建assets文件夹，使用adb reverse等。
摘要由CSDN通过智能技术生成

不得不说fb对于Android的文档支持和QA都太烂了。于是花了2个半小时才终于搭建好环境，跑起了demo，当然有可能是因为我没弄过node.js。


坑我踩了，希望你们别踩了。


我是在Mac下搭建的。Ubuntu差不多，Windows的话洗洗睡。


1. 安装homebrew，别问我homebrew是啥


2. 安装Node.js： 
   2.1 安装nvm： curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.31.0/install.sh | bash
   或者用Wget ： wget -qO- https://raw.githubusercontent.com/creationix/nvm/v0.31.0/install.sh | bash
   2.2 安装node.js
     nvm install node && nvm alias default node

最低0.47元/天 解锁文章
Bruce_Van
关注
react native 实现app demo
12-07
一个基础的react native & react-navigation V2 最新的 app框架react native 实现app demo
一个简单的demo说明集成reactnative到android项目
m00123456789的博客
11-22 1041
集成reactnative到android项目1.新建文件夹，创建子目录andorid,将android项目移动至android目录下。2.在根目录下创建package.json文件{ “name”: “MyReactNativeApp”, “version”: “0.0.1”, “private”: true, “scripts”: { “start”: “nod
Linux如何添加防火墙服务Warning: ALREADY_ENABLED: 8080:tcp
最新发布
kaka的博客
07-29 1352
Warning: ALREADY_ENABLED: 8080:tcp
React Native 开发环境搭建及Demo入门教程
shmjiao的博客
12-23 688
安卓开发环境Android studio是安卓应用的开发工具，安装它是为了帮助我们自动安装Android SDK和虚拟化套件，不需要一个个手动下载。安装studio，一直点击下一步：安装完成后打开studio会弹出初次设置之后一直下一步就行了，然后内存大的可以将内存设置调大一点。
Android和ReactNative混合开发Demo
09-03
Android和ReactNative混合开发Demo,包含Android原生加载RN页面，Android原生调用RN函数，RN函数调用原生函数
React Native接入现有Android原生工程并实现简单的RN与Android通信
kimi985566的博客
12-11 1024
对于一个新的工程，可以直接使用React Native进行开发，但是对于现有的项目如果全面改造将会是一项巨大的工程。好在RN提供了方式为我们接入现有工程。同时，对于Android中的一些组件，RN不一定有已经继承的实现方式，我们可以通过实现ReactMethod的方式实现RN使用Android原生组件。 1. 接入React Native 1. RN开发环境准备及Android原生项目 这里不再赘...
react native 环境搭建for mac
weixin_29947843的博客
04-29 492
React Native (简称RN)是Facebook于2015年4月开源的跨平台移动应用开发框架，是Facebook早先开源的JS框架 React 在原生移动应用平台的衍生产物，支持iOS和安卓两大平台。RN使用Javascript语言，类似于HTML的JSX，以及CSS来开发移动应用，因此熟悉Web前端开发的技术人员只需很少的学习就可以进入移动应用开发领域。 今天的笔记主要记录一下在mac系统下ReactNative环境的搭建： 首先要知道ReactNative的环境依赖于node、android、i
程序员面试刷题的书哪个好-React-Native-In-Action:ReactNative零基础入门到项目实战学习笔记
07-07
Demo文件目录下）,废话不多说，贴上笔记和代码。 第一部分 React 简介 一、React简介 网上资料众多，不再赘述，传送门 二、React Native开发环境配置(Mac环境) 1.编辑器 Atom，Settings快捷键： command ＋ ， 2....
React Native之React速学教程_不学react直接学react native可以吗
2401_84447149的博客
04-29 564
每一个XML标签都会被JSX转换工具转换成纯JavaScript代码，使用JSX，组件的结构和组件之间的关系看上去更加清晰。JSX并不是React必须使用的，但React官方建议我们使用 JSX , 因为它能定义简洁且我们熟知的包含属性的树状结构语法。
React Native学习资源汇总
xiangzhihong8的专栏
08-01 2292
目前主流的移动跨平台技术方案大体可以分为三类，一类是使用原生内置浏览器加载HTML5的Hybrid技术方案，采用此种方案的主要有Cordova、Ionic和微信小程序；另一类是使用JavaScript语言进行开发，然后使用原生组件进行渲染，采用此方案的主要有React Native、Weex和快应用；最后一类是使用自带的渲染引擎和自带的原生组件来实现跨平台，采用此种方案的主要是Flutter。 对于其他的浏览器方案，基本可以抛弃了，现在我们讨论移动跨平台开发主要说的是React Native和Flutter
Android中的binder机制分析一：写一个native层最简单的demo
achina2011jy的博客
09-27 1061
myservice/ ├── Android.mk ├── client │ ├── Android.mk │ ├── main_client.cpp │ └── Main_MyClient.cpp ├── interface │ ├── IMyService.cpp │ └── IMyService.h └── service ├── Android.mk ├── Main_MyService.cpp ├── MyService.cpp └── M
记录一次 ReactNative + Android 混合开发
lkjhgf50的博客
05-19 1562
这里说的混合开发与官网上说的【集成到现有原生应用】存在区别，一个是以原有的Android项目为基础，在此之上某一两个页面或业务流程用ReactNative。​​​​​​​ 而本博客要说的是在默认ReactNative项目的基础之上添加新的Android原生代码或者说原生页面。...
React Native开发的仿美团小demo
仰望 星空的专栏
01-04 1万+
使用React Native开发的一个仿美团首页小demo， 源码：https://github.com/lookingstars/RNMeituan 运行说明： 首先需要安装好运行React Native的相关环境， 首先需要安装好运行React Native的相关环境， 首先需要安装好运行React Native的相关环境， 参考官网 英文：https://fac
Android项目中集成React Native
寒江蓑笠的专栏
02-27 3382
React Native是非常强大的，但有的时候我们可能并不需要从0开始去开发一个React Native应用，而是需要把它集成到我们现有的Android工程中去，去添加单个的React Native View。本章将主要介绍在原生Android中集成React Native。 可以参考官方文档或中文文档。创建Android工程新建一个ReactNativeDemo的Android工程作为已有
React-Native-Android-Studio整合开发+环境配置+官方实例
weixin_33749242的博客
12-21 1172
linux下React Native开发环境搭建，使用Android-studio工具进行React Native整合开发。 参考React Native的官方文档，通过图文详细记录开发过程。可以查看本文档中涉及Github源码。 步骤1，2，3来配置React Native开发环境步骤4,5做react-native与Andr...
React Native与Android的交互
xiangzhihong8的专栏
09-14 1021
在使用RN进行跨平台开发的过程中，经常会设计到跨平台调用相关的内容，而在于RN进行交互的时候，最核心的就是RN提供的Component和Module。 其中，Component是专门将Native的UI暴露出来供JS调用的，而Native Module则是将Native的模块暴露出来供JS调用的，其用途不一样。在实战开发中，由于RN实现的成本比较大，或者没办法实现，而原生是非常容易实现的，这时候...
react-native 环境搭建遇到问题
热门推荐
shuai123456的专栏
07-14 2万+
1.   D:\Android\WorkSpace\AwesomeProject>react-native run-android JS server already running. Building and installing the app on the device (cd android && gradlew.bat installDebug... FAILURE: B
reactnative 报You seem to be running on device. Run 'adb reverse tcp:8081 tcp:8081'
a461083159的专栏
04-23 1003
1.首先在 Android studio 的终端 运行adb reverse tcp:8081 tcp:8081 2接着在 activity 加上 super.onCreate(savedInstanceState); SharedPreferences mPreferences = PreferenceManager.getDefaultSharedPreferences(t...
React Native入门：iOS开发环境搭建与必备技术概览
在实际操作中，开发环境的搭建通常包括安装必要的软件包和工具，如React Native CLI（命令行工具）以及Xcode（苹果的开发环境）和Android Studio（安卓开发工具）。此外，开发者还需要配置模拟器或者真机连接，以便...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值