react native (一)
开始接触app方面的工作,真心塞~

又开始了周而复始的死磕一个问题专坐一整天的节奏,关键是还没有成绩,实在无语。╮(╯▽╰)╭,还是总结一下最近心塞历程吧……
react native中文网:http://reactnative.cn/docs/0.48/getting-started.html
看看文档就上手吧(默认环境均已配好):
1.新建项目的那些事:
将npm包切换至淘宝源(下载速度快):
npm config set registry http://registry.npm.taobao.org/
安装react-native命令行工具
npm install -g react-native-cli
创建项目
进入你的工作目录,运行
react-native init MyProject //MyProjec是你的项目名称
按照提示,直至运行packager
react-native start
可以用浏览器访问http://localhost:8081/index.android.bundle?platform=android看看是否可以看到打包后的脚本js代码,(8080项目是默认端口号)
至此,一个react-native壳子的app项目新建完成。
2.主角上场:
有了‘家’,那主角是不是应该上场呢?对,接下来就应该连接上真机或者虚拟机,来看看新建项目的庐山真面目。
连接夜神模拟器时出现问题的解决方案:https://www.yeshen.com/blog/reactnativeyeshen/
3.问题接二连三:
接着,聪明的你就会看见鲜红的报警提示:
“unable to load script from assets index.android.bundle on windows”
解决方案:
①在工程目录新建assets文件
android/app/src/main/assets
②根目录下运行命令
react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
③重新安装app
react-native run-android
“Could not connect to development server”
解决方案:
摇一摇手机,然后选择弹框中的“debug server host & port for device”,设置好服务器的端口号即可。

解决方案:


解决方案:
cd android && gradlew clean THEN cd .. && react-native run-android
4.一如既往的继续……

react native (一)的更多相关文章
- React Native 之 Text的使用
前言 学习本系列内容需要具备一定 HTML 开发基础,没有基础的朋友可以先转至 HTML快速入门(一) 学习 本人接触 React Native 时间并不是特别长,所以对其中的内容和性质了解可能会有所 ...
- React Native环境配置之Windows版本搭建
接近年底了,回想这一年都做了啥,学习了啥,然后突然发现,这一年买了不少书,看是看了,就没有完整看完的.悲催. 然后,最近项目也不是很紧了,所以抽空学习了H5.自学啃书还是很无趣的,虽然Head Fir ...
- 史上最全Windows版本搭建安装React Native环境配置
史上最全Windows版本搭建安装React Native环境配置 配置过React Native 环境的都知道,在Windows React Native环境配置有很多坑要跳,为了帮助新手快速无误的 ...
- 【腾讯Bugly干货分享】React Native项目实战总结
本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://dev.qq.com/topic/577e16a7640ad7b4682c64a7 “8小时内拼工作,8小时外拼成长 ...
- React Native环境搭建以及几个基础控件的使用
之前写了几篇博客,但是没有从最基础的开始写,现在想了想感觉不太合适,所以现在把基础的一些东西给补上,也算是我从零开始学习RN的经验吧! 一.环境搭建 首先声明一下,本人现在用的编辑器是SublimeT ...
- React Native组件介绍
1.React Native目前已有的组件 ActivityIndicatorIOS:标准的旋转进度轮; DatePickerIOS:日期选择器: Image:图片控件: ListView:列表控件: ...
- React Native图片控件的使用
首先定义组件 import { AppRegistry, StyleSheet, Text, View, Image,} from 'react-native'; 然后将render返回中的模版增加I ...
- react-native学习笔记--史上最详细Windows版本搭建安装React Native环境配置
参考:http://www.lcode.org/react-native/ React native中文网:http://reactnative.cn/docs/0.23/android-setup. ...
- windows 7下React Native环境配置
React Native 是 Facebook 推出的一个用 Java 语言就能同时编写 ios,android,以及后台的一项技术,它可以做到实时热更新 .FaceBook 也号称这们技术是 “Le ...
- React Native初探
前言 很久之前就想研究React Native了,但是一直没有落地的机会,我一直认为一个技术要有落地的场景才有研究的意义,刚好最近迎来了新的APP,在可控的范围内,我们可以在上面做任何想做的事情. P ...
随机推荐
- USB2.0学习笔记连载(十九):EZ-USB TRM手册重要部分介绍
TRM手册中给出了所有的寄存器配置,在 slave fifo模式或者 GPIF模式等,所以对于用到的各种寄存器配置需要查看此手册,当然还可以配合着应用手册<AN61345>. ...
- Cocos2d-x绘制圆角矩形
/* * @brief 画圆角矩形 * @param origin 矩形开始点 * @param destination 矩形结束点 * @param radius 圆角半径 * @param seg ...
- c++ 文件增加#ifndef、#define 和 #endif 语句的意义
文件currency.h (或 currencyOverload.h) 包含了 currency类的声明和实现细节. 在文件头, 应该加上语句 #ifndef Currency_ #define Cu ...
- 【Vue】VS Code+Vue入门 Helloworld
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- CentOS 6.8 安装 RabbitMQ
放上来做个备份. 1.下载RabbitMQ http://www.rabbitmq.com/download.html 选择 RHEL/CentOS 6.x 下载即可. 或者 http://www.r ...
- 详细的Log4j使用教程
日志是应用软件中不可缺少的部分,Apache的开源项目log4j是一个功能强大的日志组件,提供方便的日志记录.在apache网站:jakarta.apache.org/log4j 可以免费下载到Log ...
- 目标跟踪之meanshift---meanshift2
均值漂移,可以对非刚性物理进行跟踪,是分参数估计,过程是迭代的过程,对光和形态不敏感,缺点是检测目标是固定的,特征不较少,模板背景没有实时更新,没有目标的位置精度预测只是梯度浓聚, 原理: 用文字标书 ...
- php -- 取整数
PHP取整数函数常用的四种方法,下面收集了四个函数: 经常用到取整的函数,今天小小的总结一下!其实很简单,就是几个函数而已--主要是:ceil,floor,round,intval ceil — 进一 ...
- Linux下yum命令详解
yum是什么yum = Yellow dog Updater, Modified主要功能是更方便的添加/删除/更新RPM包.它能自动解决包的倚赖性问题.它能便于管理大量系统的更新问题yum特点 可以同 ...
- C# Bitmap转化为BitmapImage方法
public BitmapImage BitmapToBitmapImage(Bitmap bitmap) { Bitmap bitmapSource = new Bitmap(bitmap.Widt ...