react native基础与入门
react native基础与入门
一、react native 的优点
1、跨平台(一才两用)
2、低投入高回报 (开发成本低、代码复用率高)
3、性能高:拥有独立的js渲染引擎,比传统的h5+ webview高效
4、支持动态更新(无需每次更新上传到应用市场和审核)
二、使用react native开始项目
1、安装脚手架
npm install -g react-native-cli
2、初始化项目结构
react-native init projectName
3、window下安卓环境配置 地址
注意:如果报错Registry key Error: Java version has value '1.8', but '1.7' is required。你需要把 C:\Windows 下System32文件里里的java.exe
, javaw.exe
and javaws.exe全删了。如果你的操作系统是64位的,你还要再把SysWOW64文件夹里同样删一遍。 参考地址
注意:react-native run-android后,白屏解决方法
方法一:修改手机的应用权限。参考链接
方法二:在项目的package.json加如下一句代码:
"bundle-android": "react-native bundle –platform android –dev false –entry-file index.android.js –bundle-output android/app/src/main/assets/index.android.bundle –sourcemap-output android/app/src/main/assets/index.android.map –assets-dest android/app/src/main/res/"
实例:
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest",
"bundle-android": "react-native bundle –platform android –dev false –entry-file index.android.js –bundle-output android/app/src/main/assets/index.android.bundle –sourcemap-output android/app/src/main/assets/index.android.map –assets-dest android/app/src/main/res/"
}
注意:报错提示could not get batchedbridge,请看window下安卓环境配置的方法二是否改了,还是有错的话,需要在android\app\src\main添加一个assets空文件夹
react native基础与入门的更多相关文章
- React Native基础&入门教程:初步使用Flexbox布局
在上篇中,笔者分享了部分安装并调试React Native应用过程里的一点经验,如果还没有看过的同学请点击<React Native基础&入门教程:调试React Native应用的一小 ...
- React Native基础&入门教程:调试React Native应用的一小步
React Native(以下简称RN)为传统前端开发者打开了一扇新的大门.其中,使用浏览器的调试工具去Debug移动端的代码,无疑是最吸引开发人员的特性之一. 试想一下,当你在手机屏幕按下一个按钮, ...
- 跨平台框架与React Native基础
跨平台框架 什么是跨平台框架? 这里的多个平台一般是指 iOS 和 Android . 为什么需要跨平台框架? 目前,移动开发技术主要分为原生开发和跨平台开发两种.其中,原生应用是指在某个特定的移动平 ...
- React Native基础&入门教程:以一个To Do List小例子,看props和state
本文由葡萄城技术团队于博客园原创并首发 转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. 在上篇中,我们介绍了什么是Flexbox布局,以及如何使用Flexb ...
- React Native基础概念和基础认识
学习地址:https://github.com/vczero/react-native-lesson 当我们初始化一个RN项目的时候主要的是index.ios.js文件和index.android.j ...
- React Native 基础报错及解决方案记录
刚开始上手RN,碰到很多坑,记录一下.碰到问题多去看看github上面的issue! 启动命令react-native run-ios报错 1.:xcrun: error: unable to fin ...
- React Native 入门基础知识总结
中秋在家闲得无事,想着做点啥,后来想想,为啥不学学 react native.在学习 React Native 时, 需要对前端(HTML,CSS,JavaScript)知识有所了解.对于JS,可以看 ...
- React Native初探
前言 很久之前就想研究React Native了,但是一直没有落地的机会,我一直认为一个技术要有落地的场景才有研究的意义,刚好最近迎来了新的APP,在可控的范围内,我们可以在上面做任何想做的事情. P ...
- iOS、swift、React Native学习常用的社区、论坛
<!----iOS> <!----Swift>*IOS开发常用社区:http://code4app.com/ *IOS开发常用社区:http://www.cocoachina. ...
随机推荐
- JavaScript入门学习(2)--进度条
<html> <style type="text/css"> #bar{width:0px; height:20px; background:#ee00ff ...
- Hive sql & Spark sql笔记
记录了日常使用时遇到的特殊的查询语句.不断更新- 1. SQL查出内容输出到文件 hive -e "...Hive SQL..." > /tmp/out sparkhive ...
- sqoop import/export使用经验
一.先创建一个小表(test_01)进行测试(主节点IP:169.254.109.130/oracle服务器IP:169.254.109.100) 1.测试连接oracle; sqoop list-t ...
- 《Act with Prudence》读后感
<97 Things Every Should Know>中第一个编程方面的建议 文章链接:行事谨慎 很赞同文章中的观点,在做项目中是要谨慎行事和考虑后果.一直在项目前期考虑不够周到,以至 ...
- 【Mac】gem install 出错 You don't have write permissions for the /Library/Ruby/Gems
问题描述 RedisDump 是一个用于 Redis 数据导人/导出的工具,是基于 Ruby 实现的,需要先安装 Ruby.但因为 Mac 自带有 Ruby 所以我直接用gem install red ...
- 20155235 2016-2017-2 《Java程序设计》第十周学习总结
20155235 2016-2017-2 <Java程序设计>第十周学习总结 教材学习内容总结 计算机网络 计算机网络由若干结点和连接这些结点的链路组成.网络中的结点可以是计算机.集线器. ...
- struts2官方 中文教程 系列四:Action
先贴个本帖的地址,免得其它网站被爬去了struts2教程 官方系列四:Action 即 http://www.cnblogs.com/linghaoxinpian/p/6905521.html 下载 ...
- day 1 异常基本功能
1.什么是异常?程序出现的错误 In [1]: open('xxx.txt') ------------------------------------------------------------ ...
- RHCE模拟考试
真实考试环境说明: 你考试所用的真实物理机器会使用普通账号自动登陆,登陆后,桌面会有两个虚拟主机图标,分别是system1和system2.所有的考试操作都是在system1和system2上完成.S ...
- springboot 中根据数据库表生成所有表的model,mapper和xml文件
参考文件:https://blog.csdn.net/shenmoren6/article/details/80337662?utm_source=blogxgwz1 详细信息:https://blo ...