React Native学习笔记之2
1:如何创建一个react native工程
首先进入到指定文件夹里面,然后在终端执行react-native init ReactNativeProject ;其中ReactNativeProject为工程的名称;
2:如何运用调试
可以先安装Chrome浏览器的插件React Developer Tools 然后运行时在虚拟器上按command+D就会弹出选择,可以用Stop Remote JS Debugging 就可以进入调试页面,然后再按command+alt+J 就可以进入调试的详细页面;
3:查看React Native各组件的相关接口
除了可以在React Native的中文网查看到相关信息,也可以直接查看源代码的JS文件,JS文件不仅有接口及相关说明,还有实例代码;
有些是社区维护的组件可以在下面这个里面查找到,包含相关的IOS跟安卓
4:WebStorm提供React Native代码智能提醒功能
插件地址: https://github.com/virtoolswebplayer/ReactNative-LiveTemplate
6:React/React Native 的ES5 ES6写法对照表
8: 查看相应react native版本号,及更新安装最新版
打开项目的根目录路径可以看到package.json,可以看到相应的react跟react-native的版本;
请去下面的网址【https://www.npmjs.com/package/react-native】查看react-native的npm包的最新版本,或使用npm info react-native命令查看。而react可以到https://github.com/facebook/react查看版本;
打开项目目录下的package.json文件,然后在dependencies模块下找到react-native,将当前版本号改到最新,然后在命令行中运行(译注:如果提示权限错误,就在命令前加上sudo):
$ npm install
9:main.jsbundle生成方法
步骤:
1.在React Native项目根目录下运行 npm start
2.使用curl命令生成 main.jsbundle
curl http://localhost:8081/index.ios.bundle -o main.jsbundle
3.在AppDelegate.m中选择使用main.jsbundle
注释掉
jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];
取消注释下面这一行
// jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
10:关于热更新实现可以下面这篇文章
http://blog.csdn.net/linshaolie/article/details/50961955
React Native学习笔记之2的更多相关文章
- React Native 学习笔记--进阶(二)--动画
React Native 进阶(二)–动画 动画 流畅.有意义的动画对于移动应用用户体验来说是非常必要的.我们可以联合使用两个互补的系统:用于全局的布局动画LayoutAnimation,和用于创建更 ...
- React Native学习笔记之1
1:运行React Native报连接错误解决 解决方式: 在终端进入项目文件里,然后执行:(cd Pods/React; npm run start) 2:组件生命周期介绍 创建阶段 1. getD ...
- react native 学习笔记
假设你的机器现在还没安装任何环境. 不同的操作系统.不同的目标平台,具体的步骤也会有所不同.如果你想同时开发android和ios也没问题,只需要先选一个平台开始,另一个平台的环境搭建只是稍有不同 本 ...
- React Native学习笔记
React 是使用ES6 ,支持JSX语法, 开发组件化web或native的工具. 现阶段使用Babel工具转换成ES5 代码. 组件通过props属性传递不变化的内容,UI通过state属性变动来 ...
- React Native学习笔记-1:JSC profiler is not supported.
新建React-Native工程,直接编译运行报错,控制台错误信息如下: 2016-02-22 16:49:47.317 [info][tid:com.facebook.React.JavaScrip ...
- React Native学习笔记-1:JSC profiler is not supported.(转载)
运行react-native中Example下的UIEXPLORER Project 遇到虾面报错: 2016-03-21 14:12:18.941 [trace][tid:com.facebook. ...
- React Native 开发笔记
ReactNativeDemo 学习ReactNative开发,搭建ReactNative第一个项目 React Native 开发笔记 1.安装Homebrew $ /usr/bin/ruby -e ...
- React Native 学习-01
React Native 学习 (学习版本 0.39) 一.环境配置 二.IDE选择 webstorm 1.webstorm配置 ①.首先是可以选择使用汉化包汉化.eu68 ②.安装插件和外部库. 由 ...
- react native 学习一(环境搭配和常见错误的解决)
react native 学习一(环境搭配) 首页,按照http://reactnative.cn/docs/0.30/getting-started.html#content上的介绍,下载安装pyt ...
随机推荐
- [转载]Java 8 日期&时间 API
Java 8 日期和时间 声明 本文转自http://www.journaldev.com/2800/java-8-date-localdate-localdatetime-instant,以mark ...
- 【腾讯bugly干货分享】微信Android热补丁实践演进之路
本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://bugly.qq.com/bbs/forum.php?mod=viewthread&tid=1264& ...
- HBase笔记:对HBase原理的简单理解
早些时候学习hadoop的技术,我一直对里面两项技术倍感困惑,一个是zookeeper,一个就是Hbase了.现在有机会专职做大数据相关的项目,终于看到了HBase实战的项目,也因此有机会搞懂Hbas ...
- Visual Studio 2015 移动跨平台开发初体验
微软换了新 CEO 后变化很大,对我们团队最有利的消息就是 Visual Studio 2015 支持移动应用跨平台开发. 还记不记得很早之前,Xamarin 宣布与微软成为合作伙伴的消息.显然,Xa ...
- float---浮动带来的影响与清除浮动带来的影响方法----在路上(20)
使用float会带来哪些影响: 脱标:无行级块级之分: 相互贴靠:若想之间有空隙可用margin与padding: 顶边对齐: 文字环绕: 当使用float后,子标签脱离父标签,父标签就会失去高度,此 ...
- iOS---基于对Sqlilte3的二次包装的第三次包装--->JKDBModel ,一个好用的离线缓存库
https://github.com/Joker-King/JKDBModel 1.将FMDB和DBModel拖入项目中,然后添加libsqlite3.dylib 2. #import " ...
- Nginx服务器之Nginx与tomcat结合访问jsp
本文使用linux centos系统 本文概述: JSP是一种动态网页技术标准.使用的方式是在HTML文件中插入程序段和JSP标记,而形成JSP文件.使用JSP开发WEB应用可以跨平台开发.但jsp需 ...
- Java–cvc-complex-type.4:Attribut ‘version’ must appear on element ‘web-app’
问题解析: 在web.xml中的以下代码中 <web-app xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi=" ...
- Asp.Net Mvc通用后台管理系统,bootstrap+easyui+权限管理+ORM
产品清单: 1.整站源码,非编译版,方便进行业务的二次开发 2.通用模块与用户等基础数据的数据库脚本 3.bootstrap3.3.1 AceAdmin模板源码 4.easyui1.3.5源码 5.F ...
- 纪录我的iOS学习之路
学习资料的网址 田伟宇(Casa Taloyum)有几篇介绍iOS架构的文章,一级棒!原博客链接. iOS应用架构谈 开篇 iOS应用架构谈 view层的组织和调用方案 iOS应用架构谈 网络层设计方 ...