首页 > 其他分享 >如何在运行并调试React Native App

如何在运行并调试React Native App

时间:2023-06-06 12:56:30浏览次数:47  
标签:docs App Cmd dev React native https reactnative Native

 

1. 进入工程目录,启动:Metro
   npx react-native start

 

2. 然后在新的terminal窗口中运行app

    npx react-native run-ios

第1,2步参考:https://reactnative.dev/docs/environment-setup#running-your-react-native-application

这时你的程序应该运行起来了。每次操作可以在显示Metro的窗口看到日志,包括console.log打印的结果。

3. 此时,可以在IOS Simulator窗口打开developer menu,打开方式有几种:
   a) Press Cmd-D on the keyboard. (对我不起作用)
   b) Press Cmd-Ctrl-Z on the keyboard.
   c) 在Simulator菜单 > Device > Shake (快捷键Cmd-Ctrl-Z)

 4. Debugging JS on Hermes using Google Chrome's DevTools
     See:  https://reactnative.dev/docs/hermes#debugging-js-on-hermes-using-google-chromes-devtools 

a) Navigate to chrome://inspect in a Chrome browser instance.
b) Use the Configure... button to add the Metro server address (typically localhost:8081 as described above).

        

 

TODO:  如何远程Debug,我还没实践,参考:https://reactnative.dev/docs/debugging

 

标签:docs,App,Cmd,dev,React,native,https,reactnative,Native
From: https://www.cnblogs.com/saaspeter/p/17460242.html

相关文章

  • 如何设计React应用程序的样式——比较不同的选项
    样式在创建具有视觉吸引力和用户友好的Web应用程序方面起着至关重要的作用。对于React应用程序,可以通过多种方式来设置组件和UI元素的样式。在本文中,我们将探讨几个流行的选项,包括纯CSS、CSS模块、CSS预处理器、TailwindCSS、CSS-in-JS库(如StyledComponents)以及预构......
  • uniapp能对接蓝牙打印机吗? 答案是肯定的
    ​答案是肯定的,以下是一个使用“uni-bluetooth-print”插件连接蓝牙打印机的示例代码:1.在项目目录中运行以下命令安装插件:npminstalluni-bluetooth-print2.在代码中导入插件:importbluetoothPrintfrom'uni-bluetooth-print';3.调用 `connect()` 方法连接蓝......
  • vite + react + arco-design-mobile 使用 babel-plugin-import 实现按需加载
    0.什么是vite?vite是一种新型前端构建工具。一个开发服务器,它基于原生ES模块提供丰富的内建功能一套构建指令,它使用Rollup打包你的代码,可输出用于生产环境的高度优化过的静态资源1.什么是babel?babel是一个javasctipt编译器,他是一个工具链,主要用于在当前浏览器和旧浏览器......
  • uni-app笔记
    uni-app笔记uni-app使用vue的语法+小程序的标签和API所有组件与属性名都是小写,单词之间以连字符-连接每个vue文件的根节点必须为<template>,且这个<template>下只能且必须有一个根<view>组件view==div<scriptlang="ts">//通过使用lang="ts"可以直接编写typescript......
  • “陇上食安APP”【日管控、周排查、月调度】操作流程
    移动端第一步:下载“陇上食安APP”方式1:直接点击链接点我下载方式2:手机扫码一定记得下载【商户端】!第二步:登录APP打开安装的【陇上食安APP】账号是:个人的手机号密码是:root2021@如果密码错误,或者账号不合适,联系我第三步:点【企业自律】中的【主体责任】新增如管控......
  • 手机app打包发布
    今天app已经打包成apk,  ......
  • 二、Spring Reactive Security自定义登录页
    添加配置类:@ConfigurationpublicclassMyReactiveSecurityConfig{@BeanpublicReactiveUserDetailsServicereactiveUserDetailsService(){UserDetailsuser=User.withUsername("user").password("12345")......
  • 一、Spring Reactive Security简单使用
    SpringReactiveSecurity是结合SpringWebFlux使用的。结合SpringBoot使用,简化了大量配置。 新建SpringBoot项目,添加依赖:<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-webflux</artifactId>......
  • Taro框架应用优势下的移动App开发创新模式
    最近公司的一些项目需要跨端框架,技术老大选了Taro,实践了一段时间下来,愈发觉得Taro是个好东西,所以在本篇文章中稍微介绍下。 什么是Taro?Taro(或称为Taro框架)是一种用于构建跨平台应用程序的开源JavaScript框架。它基于React和ReactNative,可以用于开发Web、iOS、Android和微......
  • React学习时,自己拟定的一则小案例(table表格组件,含编辑)
    某次在Uniapp群看到有人问uniapp如何操作dom元素。他想对这张表标红的区域,做dom元素获取,因为产品想让红色色块点击时,成为可编辑,渲染1~4月份之间的行程安排。于是,有小伙伴说让他用position定位这里,点击时使红色色块层级抬高,弄个input上去。但提问的小伙伴并没有决定这么做,随后......