2017-07-31 10:46:20 lhb_11 阅读数 938
  • React Native初级入门项目实战

    ReactNative是由Facebook公司发布的可以进行混合开发的开源技术框架。通过ReactNative可以为iOS和Android两个系统开发应用程序,“Learn once,write anywhere”。使用ReactNative开发,既拥有Native的良好人机交互体验,又保留了React框架的开发效率,集Native应用和Web应用优点于一身。

    40436 人正在学习 去看看 易荟云

选择模拟器

然后使用快捷键: 按快捷键 Ctrl/comand + M

这里写图片描述

在Android Emulator中,用鼠标点击 “Reload”
Tips:
如果 机器比较卡的话,加载会比较慢

2. ios

comand+r 直接刷新

3. 显示所有设置

在命令行输入:adb devices

React + redux + ES6 + webpack + koa + mongodb的个人博客

分享我自己手动搭建react项目的过程

4 . ios 调试

ios 模拟器的快捷键 : ctrl + command + Z (hardware 中 shake gesture),
React-Native之APP调试
React Native - 调试技巧及调试菜单说明(模拟器调试、真机调试)

5. submit text3 安装Package Control 步骤

Sublime text 3 中Package Control 的安装与使用方法

6. Sublime Text 3开发ReactNative的一些插件备忘

Sublime Text 3开发ReactNative的一些插件备忘

2019-07-16 14:57:05 weixin_39836173 阅读数 148
  • React Native初级入门项目实战

    ReactNative是由Facebook公司发布的可以进行混合开发的开源技术框架。通过ReactNative可以为iOS和Android两个系统开发应用程序,“Learn once,write anywhere”。使用ReactNative开发,既拥有Native的良好人机交互体验,又保留了React框架的开发效率,集Native应用和Web应用优点于一身。

    40436 人正在学习 去看看 易荟云

React Native 搭配夜神模拟器进行调试 (windows)

在学习 React Native 的过程中,我选择使用了夜神模拟器进行项目调试,接下来就来记录一下在使用模拟器之前的一些准备工作。

首先你得先确保以下几个东西你都安装完成并且环境变量配置完成:

  1. Java 8
  2. Python 2.x
  3. node
  4. Android Studio
  5. adb

接下去,win + R 打开命令行,进入到你的夜神安装目录bin文件夹,例如我的安装目录是 D:\Program Files\Nox,那我就输入如下指令

cd D:\Program Files\Nox\bin

进入到该目录后, 查询夜神模拟器的端口号,输入以下指令

nox_adb devices

按回车,得到结果:

红框中就是夜神模拟器的运行端口号,之后我们将adb与模拟器连接在一起

进入android安装目录下的 Sdk\platform-tools文件夹,默认应该在 C:\Users\你的用户名\AppData\Local\Android\Sdk\platform-tools (此路径根据你自己的android安装路径)

C:
cd C:\Users\你的用户名\AppData\Local\Android\Sdk\platform-tools
adb.exe connect 127.0.0.1:62001

出现 successfully 字样代表链接成功
在这里插入图片描述
接下去,你就可以执行 react-native run-android 在模拟器上进行调试了。
在这里插入图片描述

2019-02-01 09:26:00 weixin_43795169 阅读数 186
  • React Native初级入门项目实战

    ReactNative是由Facebook公司发布的可以进行混合开发的开源技术框架。通过ReactNative可以为iOS和Android两个系统开发应用程序,“Learn once,write anywhere”。使用ReactNative开发,既拥有Native的良好人机交互体验,又保留了React框架的开发效率,集Native应用和Web应用优点于一身。

    40436 人正在学习 去看看 易荟云

React-native项目使用模拟器运行
React-native我们可以使用Android Studio自带的模拟器进行运行,但是相对来说Android Studio对电脑的性能要求较高。此外,还可以使用夜神模拟器或逍遥游模拟器等,这里介绍一下逍遥游模拟器的链接过程。
(1)下载安装逍遥游模拟器 http://www.xyaz.cn/
(2)cmd调出命令窗口,输入 adb connect 127.0.0.1:21503
在这里插入图片描述
(注意:如果显示adb不是内部命令,请先配置好React-native项目中的SDK环境或者将SDK安装目录下的platform-tools下面的三个文件复制到c盘用户那里)
在这里插入图片描述
在这里插入图片描述
(3)查看是否链接到模拟器
在这里插入图片描述
(4)在React-native项目的根目录执行:react-native run-android命令
在这里插入图片描述
(5)刚开始进入模拟器会出现红色警告,点击右下角的菜单按钮,选择Dev Settings

找到Debug…在这里插入图片描述
点击进入之后,输入自己的ip地址:8081(ip地址通过命令行输入ipconfig查看)。确认之后,点击菜单–>reload即可

2019-08-18 18:19:08 museions 阅读数 95
  • React Native初级入门项目实战

    ReactNative是由Facebook公司发布的可以进行混合开发的开源技术框架。通过ReactNative可以为iOS和Android两个系统开发应用程序,“Learn once,write anywhere”。使用ReactNative开发,既拥有Native的良好人机交互体验,又保留了React框架的开发效率,集Native应用和Web应用优点于一身。

    40436 人正在学习 去看看 易荟云

react-native连接终端或模拟器调试项目

这里使用.连接真机调试.

真机调试要确保开启调试权限,并且允许usb安装未知来源的应用。

A 以下是启动真机调试步骤:

新建终端一
>$ npm start //启动node模块依赖调试环境 30s等待依赖模块加载进来
新建终端二:
>$ react-native run-android //启动真机调试

接下来等待安装到手机,注意同意安装apk,手机会监听 :8081端口,切换到终端一,等到编译进度100%的时候手机就会显示相关画面。

B react-native热更新方式:

摇一摇打开debug develop tools设置,对应选项含义可根据自身英语状况自行百度。

打开浏览器调试方式:

浏览器地址:http://127.0.0.1:8081/debugger-ui

C adb驱动直接操作安装命令【待发布...】

 

2020-01-02 12:26:45 qq_38105488 阅读数 7
  • React Native初级入门项目实战

    ReactNative是由Facebook公司发布的可以进行混合开发的开源技术框架。通过ReactNative可以为iOS和Android两个系统开发应用程序,“Learn once,write anywhere”。使用ReactNative开发,既拥有Native的良好人机交互体验,又保留了React框架的开发效率,集Native应用和Web应用优点于一身。

    40436 人正在学习 去看看 易荟云

首先按照 native 的文档进行环境的搭建,保证使用 android studio 的虚拟设备可以运行。

这里使用了夜神模拟器

查看配置 platform-tools 的环境变量中 adb.exe 版本。
命令行输入 adb version 在这里插入图片描述

然后查看 夜神模拟器中的 adb 的版本
在这里插入图片描述
在这里插入图片描述
如果版本和环境变量中的不一致,则覆盖掉夜神模拟器中的 nox_adb.exe(直接复制到 bin 目录下改个名字),

命令行连接模拟器: adb connect 127.0.0.1:62001
打开 夜神模拟器,命令行查看是否连接成功: adb devices 在这里插入图片描述

这时候在运行项目, yarn react-native run-android。模拟器中运行起来了。
在这里插入图片描述

调试菜单通过菜单键打开,可以嫌麻烦可以直接在设置中设置快捷键
在这里插入图片描述

没有更多推荐了,返回首页